2

这个问题非常简单但具有挑战性......我有一个位于可滚动 div 内的 div。两者都有一个透明的背景图像。内部 div 的内容比容器的宽度更宽,因此使其滚动没有问题,但内部 div 的宽度并没有变大,所以我们松开了背景......

这是以下代码的小提琴

HTML

<div id="container">
<div id="content">
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
    <div></div>
</div>
</div>​

CSS

#container{
    width:500px;
    overflow-x:scroll;
    background:blue;
    padding-left:200px;
}
#content{
    white-space:nowrap;
    padding:30px;
    background:green;
}
#content div{
    display:inline-block;
    height:100px;
    width:100px;
    margin-right:15px;
    background:red;
}​

我尝试了许多解决方法来不依赖于内部 div 的宽度,但我还没有找到更好的方法来做我需要的事情。感谢您的帮助。

4

2 回答 2

2

添加

display:inline-block;

它修复它..

演示在http://jsfiddle.net/xdKrF/11/

于 2012-11-08T15:09:50.907 回答
-1

尝试使用background-size:cover属性

于 2012-11-08T14:50:59.600 回答