Mike
Mike

Reputation: 616

How can I make a container fill the entire window?

I have a main container in CSS that contains all divs for the page. However, there is a white space of 8px pushing the entire container to the left. Any idea how I can get rid of it, and have the container fit the entire window without white space? If I use "margin-left: -8px" it just creates 8 pixels of white space on the right. Heres the code for the container:

#container {
height: 100%;
width: auto;
position: relative;
background-color: #E6E6E6;
min-width: 960px;
}

Upvotes: 0

Views: 248

Answers (3)

Moob
Moob

Reputation: 16184

html, body, #container {margin:0; min-height:100%;} 

Upvotes: 0

user2578173
user2578173

Reputation:

This is because of the default styles being applied by the browser stylesheet.


There are a few ways you can solve you're problem:

Apply this css rule, which effectively get's rid of any default padding or margin applied to elements.

* {
    margin: 0;
    padding: 0;
}

Or you could use a css reset stylesheet, which I recommend the most because different browsers handle elements somewhat differently and you want to even the field out so you don't run into any problems later. I recommend Eric Mayers css reset stylesheet it can be found here: http://meyerweb.com/eric/tools/css/reset/ and I use it for my own projects.

Upvotes: 1

feitla
feitla

Reputation: 1334

Just set margin: 0px; on #container, if that does not work you can set

body {
margin: 0px;
padding: 0px;
}

Upvotes: 2

Related Questions