Thanks for the encouragement guys:wave: . I found Karine's comment especially helpful about not using positionning and just using floats. I made a simple test layout this morning between running errands (just for fun:w00t2
. Now, can somone tell me why my right column doesn't quite make it to the far right? Also, is there a way to make my 3 columns have no space in between, at all, ever (useful for graphic layout)? Here is the code:
- Code: Select all
<!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=iso-8859-1" />
<title>Untitled Document</title>
<style type="text/css">
<!--
body {
background-color: #bac18e;
}
#header {
width: 100%;
border: thin solid #0099CC;
}
#leftcol {
float: left;
width: 32%;
border: thin solid #336600;
}
#centercol {
float: left;
width: 34%;
border: thin solid #336600;
}
#rightcol {
float: right;
width: 32%;
border: thin solid #993333;
}
#footer {
width: 100%;
border: thin solid #0099CC;
}
-->
</style>
</head>
<body>
<div id="header">
<div id="header">Header</div>
</div>
<div id="leftcol">
<div align="center">Left column</div>
</div>
<div id="centercol">
<div align="center">Center column</div>
</div>
<div id="rightcol">
<div align="center">Right column</div>
</div>
<div id="footer">
<div id="footer">Footer</div>
</div>
</body>
</html>
Thanks again for all your help!