Question

我有以下的html和css：

HTML：

<div id="container">
    <div id="scrollbox">
        <div id="content">
            <div id="subcontent">
                <p>bla bla bla bla bla bla bla</p>
                <p>...</p>
            </div>
        </div>
    </div>
</div>

CSS：

#container {
    width:500px;
    margin:0px auto;
}
#scrollbox {
    overflow:auto;
    overflow-y:hidden;
    border:1px solid #f2f2f2;
}
#subcontent {
    width: 10000px;
}

#content p {
    width: 60px;
    height: 40px;
    float: left;
    margin-left: 30px;
}

#scrollbox, #content p {
    height: 140px;
}

所以我有一个大的水平<div id="subcontent">填充bla bla。我希望它可以水平滚动。

问题：此解决方案仅适用于Chrome。在其他浏览器中，scrollWidth为10000px。（换句话说，滚动条很小，滚动区太长）

让它适用于所有浏览器的任何其他想法？而且我想摆脱我的width: 10000px;。

Here is a working jsFiddle example

Answer 1

您将x的溢出设置为滚动，并且该栏将始终存在，

http://jsfiddle.net/bBqkx/4/

水平滚动大小，如何防止浮动包裹

1 个答案: