title: Bootstrap dropdown nav menu item wrap (wordpress)
body: <p>Having trouble getting the submenu items under "LEARN" to wrap (Articles / Videos). 
  influentagency.com/clients/cgc_build_062117</p>
  
  <p>I've pasted some of my SASS code, tried different things, but nothing seems to work. Added the wp_bootstrap_navwalker function, tried adding classes, does not wrap no matter what I try. </p>
  
  <p>Any ideas what I'm missing here? Thanks in advance! </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>.dropdown-menu &gt; .active &gt; a, .dropdown-menu &gt; .active &gt; a:hover, .dropdown-menu &gt; .active &gt; 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;
      &amp;.navbar-default {
          border: none;
          background: #fff;
          padding: 0 15px;
          #navbar-menu{
              float: right;
              &amp;.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;
                              &amp;:hover{
                                  color: #9dcb94;
                              }
                          }
                          &amp;.item-right{
                              margin-left: 25px;
                              a{
                                  background: $green;
                                  color: #fff;
                                  border-radius: 2px;
                                  padding: 10px 14px;
                                  &amp;:hover{
                                      background: $green_hover;
                                  }
                              }
                              &amp;.current-menu-item,
                              &amp;.current_page_item,
                              &amp;.current-menu-ancestor,
                              &amp;.current-page-ancestor {
                                  a{
                                      color: #fff;
                                  }
                              }
                          }
                          &amp;.current-menu-item,
                          &amp;.current_page_item,
                          &amp;.current-menu-ancestor,
                          &amp;.current-page-ancestor {
                              a{
                                  color: $green;
                              }
                          }
                          .sub-menu{
                              display: none;
                          }
                      }
                  }
              }
          }
      }</code></pre>
  </div>
  </div>
  </p>