Spacing TOP LEFT RIGHT BOTTOM of Container

Spacing TOP LEFT RIGHT BOTTOM of Container

hi guys i'm new and making progress in css design. i tried setting the
border, margin, padding to 0 of container that has a gray background, but
i can't remove the whitespace above, below, left and right. How do i
remove it and stretch to fit the browser without extra white space on top,
bottom left and right?
here's what i have so far. Thanks :)
http://jsfiddle.net/blackknights/3yhRt/embedded/result/
@charset "utf-8";
/* CSS Document */
#container
{
min-width:1024px;
min-height:768px;
background:#CCC;
border:0;
padding:0;
margin:0;
}
#container2
{
width:1080px;
background-color:#FFF;
min-width:1024;
}
#wrapper
{
min-width:800;
min-height:600px;
}
#header
{
width:900px;
min-height:120px;
background-color:violet;
}
#menubar
{
width:900px;
height: 30px;
padding-top:5px;
padding-bottom:5px;
text-decoration: none;
}
ul
{
list-style-type:none;
padding:0;
margin:0;
display:inline;
}
li
{
list-style-type:none;
background-color:#;
border-right:1px solid #CCC;
float:left;
padding-left:30px; /*adjust space of menu text to each other*/
padding-right:30px;
padding-top:8px;
padding-bottom:8px;
}
a:link
{
text-decoration:none;
} /* unvisited link */
a:visited {text-decoration:none;
} /* visited link */
li:hover
{
background-color:#ffd640;
}
ul#mcolor li:hover > a
{
background-color:#ffd640; <!-- sets all link color when hovering to
yellow -->
}
nk */