Div's height not adjusting to content [Archive]

popcop

09-19-2009, 08:06 AM

i have a div that has some text and images within it but for some reason the dive height doesnt seem to adjust and the content seems to continue past the bottom of the div

here is the code im using:

HTML
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Gerry Mckay - Portfolio</title>
<link href="css/master.css" rel="stylesheet" type="text/css" />
</head>

<body>

<div id="content">

<div id="left">
<span class="about">About Me.</span>
<br />
CCCC
<br />
</div>

<div id="right">

<div id="header"><img src="images/topheader.gif" width="500" height="150" /></div>

<div class="row" ><span class="headers">
<img src="images/webwork.gif" width="44" height="44" align="left" />Arnold Clark </span><br />
<span class="description">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas ultricies aliquet viverra.</span><br><br>
<img src="images/work/1/ac_home.jpg" class="thumb_holder">
<img src="images/work/1/ac_search.jpg" class="thumb_holder">
<img src="images/work/1/ac_detailed.jpg" class="thumb_holder">
<br />
<br />
View Gallery
</div>

</div>
</div>
</body>
</html>

CSS

@charset "UTF-8";
/* CSS Document */

body {
margin:10px;
background-color:#665b4b;
font-family:Arial, Helvetica, sans-serif;
font-size:10px;
color:#FFF;
background-image:url(../images/topleft_logo.gif);
background-repeat:no-repeat;
}

a {
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#0CF;
text-decoration:none;
}

#header {
height:160px;
width:400px;
}

#left {
width:225px;
height:500px;
float:left;
padding-top:200px;
padding-left:10px;
}

.slider_header {
font-weight:bold;
width:195px;
height:10px;
padding:5px;
background-color:#00476a;
text-align:right;
}

.row {
clear:both;
}

#right {
display:block;
float:left;
margin-left:50px;
margin-top:30px;
}

.thumb_holder {
margin-right:10px;
margin-bottom:10px;
float:left;
padding:10px;
background-color:#ffffff;
}

.about {
font-family:"Arial Black", Gadget, sans-serif;
font-size:18px;
color:#FFF;
letter-spacing:-1px;
}

.headers {
font-family:"Arial Black", Gadget, sans-serif;
font-size:18px;
color:#FFF;
letter-spacing:-1px;
padding-left:10px;
}

.description {
background-color:#665b4b;
font-family:Arial, Helvetica, sans-serif;
font-size:11px;
color:#FFF;
padding-left:10px;
}