Forum Moderators: not2easy
What are my options for extending the left side?
<!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>Test layout</title>
</head><style type="text/css">
body {
background-color:#0F457C;
font-family:Trebuchet,"Trebuchet MS",Arial,Helvetica,sans-serif;
font-size:13px;
height:100%;
margin-top:25px;
}
.wrapper {
width:960px;
margin:0;
padding:0;
background-color:#FFFFFF;
margin:0 auto 0 auto;
}
.col_left {
float:left;
width:228px;
background-color:red;
}
.col_center {
margin: 0 0 0 235px;
padding:0;
}
.col_right {
float:right;
width:228px;
}
.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */
clear:both;
height:0;
font-size: 1px;
line-height: 0px;
}
</style>
<body>
<!-- START: wrapper -->
<div class="wrapper">
<div class="col_left">
col_left
<p>asd</p>
<p>fasd</p>
<p>fas</p>
<p>dfa</p>
<p>sdf</p>
</div>
<div class="col_right">
<p>col_right</p>
<p>long text here makes the left column background image not extend how I want it.</p>
<p>fad</p>
<p>fa</p>
<p>df</p>
<p>asdf</p>
<p>asdfas</p>
<p>df</p>
</div>
<div class="col_center">col_center</div>
<div class="clearfloat"></div>
</div>
<!-- END: wrapper -->
</body>
</html>
