我正在制作一个 CSS 菜单。为此,我使用ul
. 当我li
向左浮动时,所有li
的都会超出 ul。我的意思是高度ul
变为零。左浮动后如何li
在内部显示。ul
一种方法是div
用一些公共类制作一个标签并添加 clear: both 在css中,但我不想要这个。
我该如何解决这个问题?
只需添加overflow: auto;
到<ul>
. 这将使文本不会泄漏到 UL 之外。
见:http: //jsfiddle.net/6cKAG/
但是,根据您的操作,制作<li>
display: inline;
. 这完全取决于你在做什么!
见:http: //jsfiddle.net/k7Wqx/
如果你float
给你的孩子定义,那么你必须清除你的父母。写信overflow:hidden
给你的 UL。
ul{
overflow:hidden;
}
或者
您也可以clearfix
为此使用方法:
ul:after{
content:'';
clear:both;
display:block;
}
如果您希望 div 中溢出的文本自动换行而不是隐藏或制作滚动条,请使用
word-wrap: break-word
财产。
当浮动元素(菜单项)位于非浮动容器 ( ul
) 内时,就会发生这种情况。
这可以通过浮动容器来修复(很少接受),或者应用一个明确解决这个问题的 clearfix 。