I have watered down the layout I intend to achieve, which is 2 columns that are dynamic, 33% and 67% of available width, and a third column that is 200 pixels.
http://www.cs.lewisu.edu/~ongni/usjo...sign/test3.htm
The structure hold in IE, but totally breaks down in Firefox.
Thanks in advance for the help.
I can't believe that took me so long!
[html]
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>test page</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
#container {
margin: 0px;
padding: 0px;
width: 100%;
clear: both;
}
.co1 {
width: 33%;
background-color: #00CCFF;
}
.co2 {
position: absolute;
top: 0px;
right: 0px;
width: 67%;
background-color: #0066FF;
}
.co3 {
width: 200px;
position: absolute;
right: 0px;
top: 0px;
background-color: #00FFFF;
}
.co12 {
width: auto;
position: absolute;
left: 0px;
top: 0px;
margin-right: 200px;
}
body {
color: #333333;
background-color: #dcebff;
margin: 0;
padding: 0px 5px;
font-size: 0.9em;
}
</style>
</head>
<body>
<div id="container">
<!---containder Start-->
<div id="content">
<div class="co3">
Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x. Column 3 width 200 x xx x x x xxx x x x.
</div>
<div class="co12">
<div class="co1">
Column 1 33% content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx. Column 1 content xx x xx xx x xxx.
</div>
<div class="co2">
Column 2 67% content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld. Column 2 content xyz xyzx kjl; udoisf sjdld.
</div>
</div>
</div><!--content end-->
</div>
</body>
</html>
[/html]