2

我有一个正在处理的 CSS 菜单，但是在不设置父 UL 的宽度的情况下无法让列表项向左浮动。

我已经设置了一个 JS 小提琴，所以你可以看看 http://jsfiddle.net/FkK7Y/1/

如果你看一下“产品菜单”，你会看到我有两组链接（用漂亮的粉红色线条勾勒出来），它们堆叠在一起。我希望这些链接集彼此并排浮动（使他的子菜单更加面板化）。我觉得内联块（见 li class="subMenu"）应该在这里工作，但没有。

.mainMenu ul.subMenu li.subMenu {
  border:1px solid pink;
  display:inline-block;
  margin-right:10px;
 }

但是，如果我将宽度设置为父 UL（还有 class="subMenu" -我有一个当前在代码中注释掉的宽度参数，请随意摆弄以查看它的实际效果）内联块似乎可以工作在列表项上。

.mainMenu ul.subMenu {
  position:absolute;
  left:-9999px;
  top:34px;
  background:#fff;
  padding:0 0 10px 10px;
  z-index:-1;
  border:1px solid #600;
  min-width:100px;
  /*width:200px;*/ }

但是由于每个子菜单面板可能有一个或多个这些菜单，我不想指定宽度。我希望它随着我添加到它的列表项的数量而增长。

有没有解决的办法？

提前致谢！

4

1 回答 1

1

这就是您需要添加的所有内容：

.subMenu{
    white-space:nowrap;
}

更新：http: //jsfiddle.net/FkK7Y/2/

于 2013-04-05T18:54:03.797 回答