Menu icon Foundation
how to apply border-bottom to dropdown menu?

How do I apply a border-bottom to the submenu menu vertical list item (see below) - in my custom.scss file? Using F6.4 and SASS

 

 

<div class="top-bar" id="responsive-menu">

<div class="top-bar-left">

  <ul class="dropdown menu" data-dropdown-menu>

           <li class="has-submenu">

         <a href="#">About</a>

          <ul class="submenu menu vertical" data-submenu>

            <li style="border-bottom: 2px solid #E2ECE7;"><a href="{site_url}who-we-are">Who we are</a></li>

            <li style="border-bottom: 2px solid #E2ECE7;"><a href="{site_url}what-we-are">What we are</a></li>

            <li style="border-bottom: 2px solid #E2ECE7;"><a href="{site_url}why-we-are">Why we are</a></li>   

         </ul>

      </li>

</ul>

</div>

</div>

scssborder-bottomdropdown-menu

How do I apply a border-bottom to the submenu menu vertical list item (see below) - in my custom.scss file? Using F6.4 and SASS

 

 

<div class="top-bar" id="responsive-menu">

<div class="top-bar-left">

  <ul class="dropdown menu" data-dropdown-menu>

           <li class="has-submenu">

         <a href="#">About</a>

          <ul class="submenu menu vertical" data-submenu>

            <li style="border-bottom: 2px solid #E2ECE7;"><a href="{site_url}who-we-are">Who we are</a></li>

            <li style="border-bottom: 2px solid #E2ECE7;"><a href="{site_url}what-we-are">What we are</a></li>

            <li style="border-bottom: 2px solid #E2ECE7;"><a href="{site_url}why-we-are">Why we are</a></li>   

         </ul>

      </li>

</ul>

</div>

</div>
Max Drake over 1 year ago

Aha! finally sorted it out myself.

@include foundation-dropdown-menu
.is-dropdown-submenu {
    position: absolute;
    top: 0;
    #{$global-left}: 100%;
    z-index: 1;

    display: none;
    min-width: $dropdownmenu-min-width;

    border: $dropdownmenu-border;
    background: $dropdownmenu-submenu-background;

    .dropdown & a {
      padding: $dropdownmenu-submenu-padding;
      border-bottom: 2px solid $pale-blue;
      }
    }

Diwakar over 1 year ago

While using the above code, I'm getting the Style.css file missing error on my website, how to fix it?

Should I install any PHP extension on my server?

Using PHP 7.0