I'm having trouble getting the container div to display below the menu instead of alongside the header. Can someone help me fix this issue? Here is my HTML and CSS code:
<!DOCTYPE html>
<head>
<meta charset="utf-8" />
<title>Renault Club Macedonia - Welcome</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div class="web">
<div id="header">
<div class="logo">
<a href="#"><img src="images/logo.png" alt="Logo"/></a>
</div> <!-- logo end -->
<div class="menu">
<ul>
<li class="active"><a href="#" style="color:#ecd302">Home</a></li>
<li><a href="#">Forum</a></li>
<li><a href="#">Club</a></li>
<li><a href="#">Membership</a></li>
<li><a href="#">Gallery</a></li>
<li><a href="#">Classifieds</a></li>
<li><a href="#">Contact</a></li>
</ul> <!-- main menu end -->
</div>
</div> <!-- header end -->
<div class="container">
<p id="petrol">Prices taken from Makpetrol *prices are in denars / liter </p>
</div>
</div><!-- web end -->
@charset "utf-8";
body {
margin:0;
padding:0;
width:960px;
background:#e2e2e2;
}
a {
text-decoration:none;
color:#ffffff;
text-shadow:1px 1px #000000;
}
a:hover {
text-decoration:none;
color:#a6a5a5;
}
a:active {
text-decoration:none;
color:#ecd302;
}
.web {
width:960px;
margin-left:auto;
margin-right:auto;
}
#header {
background-repeat:no-repeat;
display:block;
margin:auto;
padding:0px;
height:110px;
background:#ecd302;
position:absolute;
top:0;
left:0;
right:0;
}
.logo {
background-repeat:no-repeat;
width:305px;
height:85px;
float:left;
margin:10px 0 0 202px;
}
.menu {
background:#4b4b4b;
text-transform:uppercase;
word-spacing:32px;
font-size:20px;
font-family:Arial, Helvetica, sans-serif;
font-weight:bold;
text-decoration:none;
text-align:center;
border-bottom:1px solid #000;
border-top: 1px solid #000;
display:block;
position:absolute;
top:105px;
left:0;
right:0;
}
ul {
}
li {
display:inline;
}
.container {
background:#929191;
left:0px;
right:0px;
text-align:right;
width: 960px;
font-size:12px;
}
If you need more information or clarification on my question, please feel free to reach out to me.