I Need to Remove the Horizontal Scrollbar on an Overflown <Div>

How to remove Horizontal scroll-bar?

try this

body {
  overflow-x: hidden;
  max-width: 100%;
}

Delete horizontal scrollbar

The horizontal scrollbar appears because your content is too wide for screen. Check with the width's of your elements.
A quicker solution is to just limit your body's width and scrollbar would be gone.

body { width: 98% } works alright in your case. You can also use body { overflow-x : hidden} and just hide the scrollbar if you're sure you don't have content that needs to be accessed by scrolling horizontally.

Remove horizontal scroll bar in CSS

The scrollbar appears because the content is too wide for your screen.

Just omit the width on the div element, it will auto-expand to 100% of it's parent. Floating the facebook button to the right like you already did should then align the button correctly without scrollbar.

If you don't get a satisfying solution you can still declare overflow:hidden on the containing div to supress the scrollbars.

This would be the result: http://jsfiddle.net/poikl/u4kMs/8/

How do I remove the horizontal scroll bar from my Navbar

Add overflow-x: hidden; to the style= attribute of your navbar.

HTML and enable div's horizontal scrolling but hide the horizontal scrollbar

There's a similar question Hide scroll bar, but still being able to scroll, but I believe your question is focused on the horizontal scrollbar. In that other question, I found something that can help you, this answer. Jean posted that answer where he puts margin-bottom: -17px; in the container's child to hide the scrollbar.I did a simple jsFiddle to ilustrate his technique. It's a hack to hide the scrollbar, I didn't check if this work on all major browses but it works on chrome and firefox.

I need to remove the Horizontal Scrollbar on an overflown DIV

You could try using the

overflow-y: scroll;

This will give you a vertical scroll-bar...

---

Using

overflow-y: auto;

will only show the scrollbar if it is necessary.

DISABLE the Horizontal Scroll

Try adding this to your CSS

html, body {
    max-width: 100%;
    overflow-x: hidden;
}

---

Related Topics