design with 3 columns (non standard)

PHP6

04-25-2011, 01:37 PM

Hello,

Can anyone tell me if there is any way to make similar design with pure DIV and CSS? As you can see the whole design contains 3 columns. The center one has fixed size 600 px and it is located in the center of a page. The left and right ones are stretched to the max allowed width.

<table width="100%" border="1">
<tr>
<td bgcolor="#0000FF"> </td>
<td width="600" bgcolor="#FF0000"> </td>
<td bgcolor="#00FF00"> </td>
</tr>
</table>

Thanks in advance and waiting for your reply

harbingerOTV

04-25-2011, 02:11 PM

http://www.gunlaug.no/tos/moa_27a.html

bullant

04-25-2011, 02:14 PM

something like this

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title></title>
<style type="text/css">
#wrapper {
width: 900px;
margin: 0px auto 0px auto;
border: 1px solid black;
}
#content {
width: 100%;
position: relative;
}
#col1 {
float: left;
width: 16%;
border: 1px solid red;
}
#col2 {
margin: 0px auto 0px auto;
width: 66%;
border: 1px solid blue;
}
#col3 {
float: right;
width: 16%;
border: 1px solid red;
}
</style>
<script type="text/javascript"></script>
</head>
<body>
<div id="wrapper">
<div id="content">
<div id="col1">COLUMN 1</div>
<div id="col3">COLUMN 3</div>
<div id="col2">COLUMN 2</div>
</div>
</div>
</body>
</html>

PHP6

04-25-2011, 03:35 PM

http://www.gunlaug.no/tos/moa_27a.html
That's exactly what I was looking for! Thank you very much.

something like this
That's not right solution since you have fix size for left and right columns. % is not a solution since center column should have fixed size (600 px). But thank you anyway for your time and will to help!