html - 嵌套列表上的自动宽度

Question

我有一个嵌套列表，例如：

<ul id="nav">
    <li id="" class="">
      <a href="http://site.com/wedding.html" class="">Wedding</a>

      <div class="flyoutWrapper" style="display:block;">
        <ul class="flyout fourCol">
          <li id="" class="">
     .....
          </li>
          <li></li>, etc
        </ul>
      </div>
    </li>
</ul>

我希望 class="flyoutfourCol" 中的所有 li 都彼此相邻浮动。

这就是我希望我的下拉列表看起来的样子：

#nav .flyout.fourCol { width:900px; }

http://jsfiddle.net/t7esz/（这工作）

#nav .flyout.fourCol { width:auto; }

http://jsfiddle.net/sumcA/2/（这不起作用！）

Answer 1

如果您只希望它扩展，请将min-width属性设置为固定值（如 900 像素）。继续width自动。

我还没有检查你的整个菜单是如何工作的，但是在 .flyout.fourCol 上设置最小宽度似乎只适用于整个菜单。