inline block list foundation

_component_navigation.scss

$main-height: 45px;
.menu-name-main-menu{
  > .menu{
    > li{
      @include inline-block-list-item;
      position: relative;
      &:hover{
        .menu{
          display: block;
        }
      }
    }
    .menu{
      display: none;
      position: absolute;
      left: 0;
      top: $main-height;
    }
  } // > .menu
  a{
    @include height-lineheight($main-height);
    display: block;
    padding: 0 emCalc(12px);
    text-decoration: none;
    text-transform: uppercase;
  }
} //.menu-name-main-menu

.nav-wrapper{
   position: relative;
   z-index: 11;
}