Div adding scroll bars even with overflow: hidden

Question

What I'm trying to do is have a full screen background with a radial image over it with no scroll bars. Right now it kind of works. By that I mean that the div with the radial gradient(img) adds a scroll bar even with overflow: hidden.

html { 
background: url(background.jpg) no-repeat center center fixed; 
-webkit-background-size: cover;
-moz-background-size: cover;
-o-background-size: cover;
background-size: cover
}


#glow{
width:1043px;
height:763px;
position:absolute;
left:50%;
top:50%;
background-image: url('outer_glow.png');
margin-left:-543px; /* Negative half the width*/
margin-top:-381px; /* Negative half the height */
overflow: hidden;
}

What i'm trying to do is if the image radial is too big to just cut it off and center it. But currently it still shows a vertical bar in my browser. html below

<!DOCTYPE html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<link href="styleit.css" rel="stylesheet">
<title>Title</title>
</head>
<body>
<div id="glow"></div>
</body>
</html>

overflow: hidden only effects the element with the attribute. As in, only if the contents of the #glow element would overflow would it be hidden. Try adding overflow: hidden to the body element. — MushinNoShin
– MushinNoShin, Commented Dec 1, 2012 at 21:47

4lbertoC · Accepted Answer · 2012-12-01 21:49:45Z

1

The problem here is that you are not taking into account that the last node in the DOM tree is the body element.

What happens is that, when you resize the window, the body sees that its children is big than itself, and so it shows the scrollbars.

Try adding this to your CSS:

body {
  overflow: hidden;
}

answered Dec 1, 2012 at 21:49

4lbertoC

2431 silver badge6 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Div adding scroll bars even with overflow: hidden

1 Answer 1

Comments

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Related