Show Horizontal Scroll Only In Div Using CSS
Here we consider how to show horizontal scroll only using CSS.
Lets start with one example here.
Suppose we have a Div as shown below.
Here we have given a particular height and width for this Div.
We have enabled Scrolling also.
The style applied for this Div is as shown below.
.clsScroll{
width: 400px;
height: 200px;
overflow:auto;
background : yellow;
}
On runtime, The result will be like this.
Now for showing only horizontal Scrolling, apply following style.
.clsScroll{
width: 400px;
height: 200px;
background: yellow;
overflow-y: hidden;
overflow-x: auto;
}
Here we have made vertical Scroll hidden.
overflow-y : hidden.
And enabled horizontal Scroll.
overflow-x : auto.
By applying above style, we can make a div only horizonatlly scrollable.
On runtime, The result will be like this.
