Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

how to hide horizontal scrollbar in div tag

I have a div with size x=540px y=600px

I want to hide horizontal scroll bar even if text is bigger than x size.

How can i hide just the horizontal scroll bar?

like image 622
ngmajid Avatar asked Jul 13 '10 09:07

ngmajid


People also ask

How can show horizontal scrollbar in Div?

For horizontal scrollable bar use the x and y-axis. Set the overflow-y: hidden; and overflow-x: auto; that will automatically hide the vertical scroll bar and present only the horizontal scrollbar. The white-space: nowrap; property is used to wrap text in a single line.

How do I hide the scrollbar in embed?

Use your embed tag inside a container with overflow hidden. Then set the width of the embed with 100% + 17px (the default width of a scrollbar).

How do I stop horizontal scrolling in web design?

You can also set the overflow-x CSS property to hidden, which prevents child content from wrapping within its container but turns off sideways scrolling. Another solution is to set the width of child elements to 100%.


2 Answers

use overflow-x

<div class="MyDivClass"></div>

CSS:

.MyDivClass {
    height: 600px;
    width: 540px;
    overflow-x: hidden;
}

if you also want to hide the vertical use overflow-y: hidden; or for both just overflow: hidden;

like image 126
rob waminal Avatar answered Oct 23 '22 06:10

rob waminal


.MyDivClass {
    height: 600px;
    width: 540px;
    overflow-x: hidden;
}
like image 39
user1685515 Avatar answered Oct 23 '22 06:10

user1685515