Menu
Why is it that once I float my divs, the bottom of the webpage doesn’t display AFTER the floating divs? They show on top of the bottom of the site ?. I am a beginner with Divs. Any help would be greatly appreciated!
Here is an what the site looks like [url]http://www.worealmedia.com/blackhawks/indextest.html
And the Code:
[SIZE=”5″]CODE
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “
<html xmlns=”
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<link rel=stylesheet href=”styleSheets/style.css” type=”text/css” media=screen>
<title>BC Blackhawks – AAA Spring Hockey Club</title>
</head>
<body>
<div id=”main”>
<img src=”images/banner.png” />
<div id=”nav”><script type=”text/javascript” src=”scripts/nav.js”></script>
<a href=”index.html” onmouseover=”over_button()” onmouseout=”up_button()” ><img src=”images/nav_01.png” alt=”BC Blackhawks Home” name=”buttonOne” /></a><a href=”BC_Blackhawks_Spring_Hockey_Club.html” onmouseover=”over_button2()” onmouseout=”up_button2()” ><img src=”images/nav_02.png” alt=”BC Blackhawks About Us” name=”buttonTwo” /></a><a href=”BC_Blackhawks_Camps.html” onmouseover=”over_button3()” onmouseout=”up_button3()” ><img src=”images/nav_03.png” alt=”BC Blackhawks Camps” name=”buttonThree” /></a><a href=”BC_Blackhawks_Teams.html” onmouseover=”over_button4()” onmouseout=”up_button4()”><img src=”images/nav_04.png” alt=”BC Blackhawks Teams” name=”buttonFour” /></a><a href=”BC_Blackhawks_Contact.html” onmouseover=”over_button5()” onmouseout=”up_button5()”><img src=”images/nav_05.png” alt=”BC Blackhawks Contact Us” name=”buttonFive” /></a>
</div>
<div id=”navspace”></div>
<div id=”wrapper”>
<div id=”spacer”></div>
<div id=”contenttext” style=”width:180px; float:left;”>
<img src=”images/sponsors.png” />
<p>These
<br />
Are our sponsers</p>
</div>
<div id=”contenttext” style=”width:361px; float:right;”><img src=”images/aboutus.png” /></div>
<div style=”width:900px; background-color:#FFFFFF”>Hi</div>
</div>
</div>
</body>
</html>
[SIZE=”5″]STYLE
body {
margin: 25px 0px;
padding: 0px;
text-align: center;
background-color:#000000;
color:#FFFFFF;
font-family:Calibri, Arial, Helvetica, sans-serif;
font-size:14px;
}
div#main {
width: 900px;
margin: 0px auto;
text-align: left;
padding: 0px;
border: 15px solid #171717;
background-color: #000000;
}
div#navspace {
background-color:#000000;
height:20px;
width:900px;
}
div#contenttext {
background-color:#333333;
}
div#wrapper {
margin:0 auto;
width:900px;
}
div#spacer {
clear: both;
}
a {
color:#333333;
border: none;
padding:0px;
padding:0px;
border:none;
margin:0px;
}
img {
padding:0px;
border:none;
margin:0px;
}
#nav {
height:40px;
width:900px;
padding:0px;
border:none;
margin:0px;
}