CODEWITHSUNDEEP
htmlcssoverflow
C12
C12

Reputation: 79

Overflow: auto gives an ugly scrollbar, how do I get rid of it?

Ok, so I've been making a website and a problem that I had with it is that the inner div #content wasn't expanding to the full size of the page, letting text flow over in a sloppy manner that made it hard to read over the background image. I used overflow: auto; to fix my problem, but now there's a scrollbar that I didn't want on the page. Here's the parts of the CSS that manage the body, html, and #content elements (#content is a div).

body, html {
    height: 100%;
    font-family: Helvetica, Arial, sans-serif;
}
body {
    background-color: black;
    color: white;
    background: url('c12background.jpg');
}
#content {
    height: 100%;
    width: 80%;
    margin: auto;
    padding: 5px 5px 5px 5px;
    background-color: black;
    overflow: auto;
}

Upvotes: 0

Views: 455

Answers (2)

SG_Rowin
SG_Rowin

Reputation: 622

You dont have to include overflow in your #content, instead add word-wrap in your P tags:

p,a,li{
  word-wrap: break-word;
}

Upvotes: 0

Roko C. Buljan
Roko C. Buljan

Reputation: 206151

Add margin:0;

body, html {
  margin: 0;       /* ADD */
  height: 100%;
  font-family: Helvetica, Arial, sans-serif;
}

Upvotes: 1

Related Questions