CSS - 仅显示固定宽度和高度 div 的水平滚动条
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/8049141/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS - Show only Horizontal Scroll bar for a fixed width and height div
提问by shennyL
I got a div which is of fixed width and height:
我有一个固定宽度和高度的 div:
#containersimg
{
width: 900px;
height: 135px;
}
And I have many images inside, with width 90px and height 120px. So i want to have my images all in a row, and show only horizontal scroll bar to scroll through the images.
我里面有很多图像,宽度为 90 像素,高度为 120 像素。所以我想让我的图像全部排成一行,并且只显示水平滚动条来滚动图像。
I need to make this work in both FF and IE8 and above. I tried the overflow-x and overflow-y but I didn't helped.
我需要在 FF 和 IE8 及更高版本中进行这项工作。我尝试了溢出-x 和溢出-y,但我没有帮助。
Any idea?? Hope can get some help here... thanks...
任何的想法??希望能在这里得到一些帮助...谢谢...
回答by extols
You need a wrapping div inside your scrolling container to ensure that they are not constrained by width and then set overflow-x: scroll
on the container. I've mocked up a quick fiddle to demonstrate. http://jsfiddle.net/vUEYG/
您需要在滚动容器内包装一个 div,以确保它们不受宽度的限制,然后overflow-x: scroll
在容器上进行设置。我模拟了一个快速小提琴来演示。http://jsfiddle.net/vUEYG/
回答by Graeme Leighfield
Give this a go :)
试一试:)
-ms-overflow-x: hidden;
Taken from this great resource CSS div element - how to show horizontal scroll bars only?
取自这个很棒的资源CSS div 元素 - 如何仅显示水平滚动条?
回答by Rashmi Kant
you can add first overflow:auto
您可以添加第一个溢出:自动
#containersimg
{
width: 900px;
height: 135px;
overflow:auto;
overflow-x:hidden;
}
may help you
可能会帮助你