PDA

View Full Version : Three Column Website?


murj
01-10-2011, 10:31 AM
I'm trying to create a 3 column website where the middle column is about 2/3 of the page and the columns on either side are smaller. I've got a type of code for it but when I type in the columns the text isn't confined to it. This is the code I have so far.

<!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>Untitled Document</title>
<style type="text/css">
<!--
#container {
height: 500px;
width: 1000px;
margin-right: auto;
margin-left: auto;
}
body p {
text-align: center;
}
#left {
float: left;
height: 500px;
width: 20%;
}
#center {
float: left;
height: 500px;
width: 60%;
}
#right {
float: left;
height: 500px;
width: 20%;
}
-->
</style>
</head>

<body>
<div id="container">
<div id="left">left column</div>
<div id="center">center column</div>
<div id="right">right column</div>
</div>
</body>
</html>

I also need to be able to center align the middle column too. Could someone please help? I'm very new to this. Using CS5

Corrosive
01-10-2011, 11:05 AM
Take the heights off the columns and they should grow with the content.

murj
01-10-2011, 11:31 AM
Removing the heights didn't fix the problem :\

What I originally wanted was to center the content and keep it within parameters, just so that the text didn't stretch all the way across the page. If you could help with that then we won't even need the left and right columns

Corrosive
01-10-2011, 12:00 PM
Oh, sorry. Understand now; http://www.dreamweaverclub.com/css-center-content.php