ブートストラップドロップダウンメニュー項目のラップ（wordpress）

Question

「学習」の下にあるサブメニュー項目をラップ（記事/動画）するのに問題があります。 influentagency.com/clients/cgc_build_062117

SASSコードの一部を貼り付けて、さまざまなことを試みましたが、何も動作していないようです。 wp_bootstrap_navwalker関数を追加しました。クラスを追加しようとしましたが、何を試してもラップしません。

私はここで何が欠けていますか？前もって感謝します！

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus { 
 
    color: #fff; 
 
    text-decoration: none; 
 
    outline: 0; 
 
    background-color: #777; 
 
    
 
} 
 

 
.dropdown-menu { 
 
    flex-wrap: wrap; 
 
} 
 

 

 

 
.navbar{ 
 
    border-radius: 0; 
 
    webkit-border-radius: 0; 
 
    min-height: 1px; 
 
    margin-bottom: 0; 
 
    &.navbar-default { 
 
     border: none; 
 
     background: #fff; 
 
     padding: 0 15px; 
 
     #navbar-menu{ 
 
      float: right; 
 
      &.navbar-collapse{ 
 
       padding: 0; 
 
       margin: 0; 
 
       .navbar-nav{ 
 
        float: none; 
 
        margin: 0; 
 
        padding: 0; 
 
        li{ 
 
         display: inline-block; 
 
         float: none; 
 
         margin: 23px 0 0 0px; 
 
         a { 
 
          color: #333; 
 
          font-size: 14px; 
 
          display: block; 
 
          text-decoration: none; 
 
          @include OpenSansSemiBold; 
 
          padding: 4px 8px; 
 
          &:hover{ 
 
           color: #9dcb94; 
 
          } 
 
         } 
 
         &.item-right{ 
 
          margin-left: 25px; 
 
          a{ 
 
           background: $green; 
 
           color: #fff; 
 
           border-radius: 2px; 
 
           padding: 10px 14px; 
 
           &:hover{ 
 
            background: $green_hover; 
 
           } 
 
          } 
 
          &.current-menu-item, 
 
          &.current_page_item, 
 
          &.current-menu-ancestor, 
 
          &.current-page-ancestor { 
 
           a{ 
 
            color: #fff; 
 
           } 
 
          } 
 
         } 
 
         &.current-menu-item, 
 
         &.current_page_item, 
 
         &.current-menu-ancestor, 
 
         &.current-page-ancestor { 
 
          a{ 
 
           color: $green; 
 
          } 
 
         } 
 
         .sub-menu{ 
 
          display: none; 
 
         } 
 
        } 
 
       } 
 
      } 
 
     } 
 
    }

Answer 1

問題は、あなたのCSSドロップダウンメニューにすべてメニュー項目display-inline、でもものを作っているということです。

.navbar.navbar-default #navbar-menu.navbar-collapse .navbar-nav li{ 
    display: inline-block; 
    /* other styles here also */ 
} 

あなたはあなたの中に以下のものを含める必要がそれを上書きするCSS：

.navbar.navbar-default #navbar-menu.navbar-collapse .navbar-nav .dropdown-menu li{ 
    display:block; 

}

はこれを行うには、あなたのSASSに以下を追加する必要があります。

.navbar-nav{ 
    [...] 
    li{ 
     display: inline-block; 
     [...] 
    } 
    .dropdown-menu li { display:block;} 
}