Question

如何将块元素水平保存在div中而不让它溢出。好朋友，我的意思是我有一个div宽度为100px的4个div元素，宽度为300px。所有4个div都浮动到右边，但最后一个div被包裹到下一行。我希望它保持水平而不被包裹或溢出。只是被隐藏 HTML

 <div class="f">
    <div>one<\div>
    <div>two<\div>
    <div>three<\div>
 <\div>

CSS

 .f
 {
    width:300px;
    height:120px;
    background:yellow;
    overflow:hidden;
 }
 .f div
 {
    width:100px;
    height:100px;
    float:right;
    backgroud:green;
 }

顺便说一句，我希望它像Windows 8开始菜单，但我不想滚动。我想用js

制作滚动条

Answer 1

块元素总是占用整个可用宽度。你想在这里使用的是inline-block，它们只是接受高度和宽度的内联元素。

隐藏溢出应用overflow:hidden

如果您打算通过提及win-8水平滚动，请应用

white-space:nowrap对于这个小提琴中的容器：

JSFiddle

保持块元素水平

1 个答案: