2013-04-05 33 views
2

我有一个css菜单,我正在处理上,但无法让列表项左移,而未设置父UL的宽度。获取UL与内容一起增长(内嵌块列表项)

我已经设置了JS提琴所以如果你看看在“产品菜单”你可以看看 http://jsfiddle.net/FkK7Y/1/

你会看到我有两套链接(中概述一条很漂亮的粉红色线条),它们叠在一起。我希望这些链接可以彼此并排浮动(使他的子菜单更加简洁)。我觉得像内联块(见李类=“subMenu”)应该在这里工作,但没有。

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

但是,如果我设置宽度父UL(也CLASS =“子菜单” - 我有一个在代码当中的宽度参数,随意摆弄,看看它在行动)内联块似乎在列表项上工作。

.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;*/ } 

但是因为每个子菜单面板可能有这些菜单我不想指定宽度的一个或多个。我想这与我添加到它的列表中的项目数量保持增长。

有没有办法解决这个问题?

在此先感谢!

回答

1

这是所有你需要添加:

.subMenu{ 
    white-space:nowrap; 
} 

更新时间:http://jsfiddle.net/FkK7Y/2/

+0

谢谢!它在chrome中效果很好,但是在firefox中也不行,或者在我的实际工作副本中(即使是JS小提琴)也可以在我的代码中使用这两种浏览器。将继续在它。 – ryann 2013-04-05 19:52:29

+0

如果您遇到任何其他问题,请告知我们。 – welbornio 2013-04-05 20:13:40

+0

我在我的文件中发现了冲突的css谢谢! – ryann 2013-04-18 20:26:05