Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

CSS - use a horizontal scrollbar only

Tags:

css

i need to use an horizontal scollbar only if the content of the div is longer than the width value.

so i write :

.viewgallerylist{width:920px; float:left; padding-top:20px; height:120px; border-bottom:1px #000000 solid; overflow-x: scroll;}

the problem is that the scrollbar are 2, 1 horizontal and 1 vertical. How to remove the vertical one? cheers

like image 512
markzzz Avatar asked Sep 18 '10 16:09

markzzz


People also ask

How do I make a horizontal scroll bar in CSS?

To enable horizontal scrolling, we can use the CSS property overflow-x. If we assign the value scroll to the overflow-x property of the container element, the browser will hide horizontally overflowing content and make it accessible via horizontal scrolling.

How do I show the scroll bar only when needed CSS?

Use overflow: auto . Scrollbars will only appear when needed. (Sidenote, you can also specify for only the x, or y scrollbar: overflow-x: auto and overflow-y: auto ).

How do I stop vertical scrolling in CSS?

To hide the vertical scrollbar and prevent vertical scrolling, use overflow-y: hidden like so: HTML. CSS.


1 Answers

.viewgallerylist {
    min-width: 920px;
    overflow: hidden;
    -ms-overflow-x: auto; /* IE8 */
    overflow-x: auto;
}

(min-width doesn't work in IE6, in case you still want to support that dinosaur)

like image 87
Blaise Avatar answered Oct 23 '22 02:10

Blaise