0
我有一列视频元素,如果它们溢出容器的宽度,我想水平滚动。不幸的是我得到它滚动,但滚动条是很长的路要走。CSS水平DIV滚动
我只是想滚动到内容的长度。
演示在http://jsfiddle.net/d16uh70k/
CSS
#RTCChatContainer
{
/*overflow: auto;*/
overflow-x: scroll;
overflow-y: hidden;
height: 152px;
width: 100%;
border: 1px dashed blue;
}
#RTCChat
{
display: block;
height: 122px;
width: 600%;
max-width: 600%;
border: 1px dashed red;
}
#RTCChat video
{
display: inline-block;
border: 1px solid black;
}
HTML
<div id="ContentWrapper" class="row">
<div class="col-sm-4">
</div>
<div class="col-sm-8">
<div id="RTCChatContainer">
<div id="RTCChat"><video id="RTCMyVideo" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf0" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf1" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf2" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf3" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf4" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf5" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf6" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf7" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf8" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video><video id="asdfsdf9" poster="http://i.imgur.com/plrR0w1.png" autoplay="true" muted="true" height="112" width="150"></video></div>
</div>
</div>
</div>
<footer></footer>
</div>
这是因为#RTCChat设置为600%的宽度。 – cport1 2014-11-03 18:51:50