|
|
|
New Member: Posts Will Be Moderated
Hey I just begun learning css and html and am having a problem with my webpage.
I noticed that when I previewed the page I had created in notepad++, it only filled a small part of the left side of the screen. What i want to know is how do I get my webpage to cover up the whole page like almost every site on the internet does? All i see is white on the other side of the screen, please help
Here is my css code :
#container {
width:900px
}
#header{
width:900px;
height:100px;
border-bottom:2px solid #999;
background-color:#036;
}
#leftnav {
float:left;
width:140px;
height:300px;
background-color:#03C;
border-right: 1px dashed #03F;
}
#rightnav {
float:right;
width:140px;
height:300px;
background-color:#0CF;
border-left:1px #0F6;
}
#midsection{
width:600px;
background-color:#30C;
}
#footer {
clear:both;
background-color:#F00;
}
and here is my html code :
<html>
<head>
<link rel="stylesheet" href="stylesheet.css" type="text/css" />
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="leftnav">
<ul>
<li><a href="http://www.w3schools.com/">Homepage</a></li>
<li><a href="http://www.w3schools.com/">About Us</a></li>
<li><a href="http://www.w3schools.com/">New Releases</a></li>
<li><a href="http://www.w3schools.com/">Upcoming events</a></li>
</ul>
</div>
<div id="rightnav">
<li><a href="http://www.w3schools.com/">Visit W3Schools</a></li>
<li><a href="http://www.w3schools.com/">Visit W3Schools</a></li>
<li><a href="http://www.w3schools.com/">Visit W3Schools</a></li>
<li><a href="http://www.w3schools.com/">Visit W3Schools</a></li>
</div>
<div id="body">
</div>
</div>
<div id="footer"></div>
</div>
</body>
</html>
Ps: notice that the colors and links are just examples that will be changed, and I apoligize if I have specefied to much information, first time posting here so I hope you guys don't mind
Established Member
if you want the content centered add
margin-left:auto;
margin-right:auto;
to your container ID that will allow the site to resize around your central content so that the whitespace will be on either side in equal proportions
hope thats what you were asking if not let me know and I will try and help
Posting Permissions
Reply With Quote