index.php
HTML Code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="stylesheet" type="text/css" href="style.css" />
<title>TheAngelsCo</title>
</head>
<body>
<div id="big_wrapper">
<header id="top_header">
<h5>Welcome to TheAngelsCo</h5>
</header>
<nav id="top_menu">
<ul>
<li>Home</li>
<li>Register</li>
<li>Download</li>
</ul>
</nav>
<section id="main_section">
<article>
<header><h3>News</h3></header>
<p>Testing of the section!</p>
<footer><p>- Written by Ares[PM]</p></footer>
</article>
</section>
<aside id="side_stats">
<h5>Server Statistics</h5>
</aside>
<footer id="bottom_footer">
Copyright TheAngelsCo 2012
</footer>
</div>
</body>
</html>
style.css
[quote]
*{
margin:0px;
padding:0px;
}
h5{
font:bold 20px Tahoma;
}
header, section, footer, aside, nav, article{
display:block;
}
body{
text-align:center;
}
#big_wrapper{
border:1px solid black;
width:1000px;
margin:20px auto;
text-align:left;
}
#top_header{
background:yellow;
border:1px solid blue;
padding:20px;
}
#top_menu{
background:blue;
color:white;
}
#top_menu li{
display:inline;
list-style-type:none;
padding:5px;
}
#main_section{
float:left;
width:660px;
margin:30px;
}
#side_statistics{
float:left;
width:220px;
margin:20px 0px;
padding:30px;
background:black;
}
#bottom_footer{
clear:both;
text-align:center;
padding:20px;
border-top:2px solid black;
}
article{
background:gold;
border:1px solid red;
padding:20px;
margin-bottom:15px;
}
article footer{
text-align:right;
}
[quote]