如何在 Foundation 5 中制作全角子菜单

Question

我试图将子菜单的宽度设置为 100%，但它不起作用。

如果有人能帮助我，将不胜感激

http://codepen.io/maiterosalie/pen/OMgeeZ

<div class="row" id="menu">
    <div class="columns small-2">
      <a href="#" id="logo">
        <img src="http://indexrd.com/application/public/img/logo.svg" width="60" height="60" id="logo">
      </a>
    </div>
    <ul class="small-8 .small-offset-1 columns">
      <li><a class="trans active" href="#">Menu</a></li>
      <li>
        <a class="trans" id="servicios" href="#">Sub Menu</a>
        <ul class="submenu">
          <li><a class="trans" href="#">link #1</a></li>
          <li><a class="trans" href="#">link #2</a></li>
          <li><a class="trans" href="#">link #3</a></li>
          <li><a class="trans" href="#">link #4</a></li>
        </ul>
      </li>
      <li><a class="trans" href="#">Menu</a></li>
      <li><a class="trans" href="#">Menu</a></li>
    </ul>

Answer 1

您的 div 元素 < div class="row" id="menu"> 没有用 < / div> 关闭。您需要它，以便您的编码正确。您还可以将 style="width: 100%;" 添加到顶部 div class，或者您希望菜单看起来如何。这是因为 div 元素是一个容器，您必须为其设置特定的宽度。因此，无论您放入什么，都可以扩展到您选择制作它的百分比数量。希望对您有所帮助。

如何在 Foundation 5 中制作全角子菜单

How to make a full width submenu in foundation 5

html

css

zurb-foundation