html - 如何使此显示内联

Question

当我尝试在一行中显示列表但它没有这样做时，有人可以帮我找到错误。

#main-nav ul ul li { display: inline; }

但文本不显示行。请看一下 jsfiddle.net/EZJwM

Answer 1

我改变了

display: inline 

到

float:left 

并得到了这个http://jsfiddle.net/EZJwM/5/

菜单未居中，但它们显示在一行中。

Answer 2

解决您的问题 js fiddle demo

我改为display:block将display:inline它放在一条线上，但你必须考虑到你的风格设计，我认为main-nav你应该使用 css 类来避免与你真正想要的东西相交，否则你会变得如此模糊

改变 1

#main-nav ul li{ display: inline; }

改变2

#main-nav a:after { color: #aeaeae; content: attr(data-description); font-size: 11px; font-style: italic; font-weight: 400; display: inline; line-height: 0; margin: 3px 0 -3px; text-transform: lowercase; }

改变 3

#main-nav ul ul a { border: 0; border-bottom: 1px solid #252525; border-top: 1px solid #4c4c4c; color: #fff; display: inline; font-family: 'Lucida Sans Unicode', 'Lucida Grande', sans-serif; font-size: 11px; letter-spacing: 0; font-weight: 400; padding: 8px 20px !important; text-align: left; text-transform: none; }