I have three div that i wish to display horizontally within a div.
First column displays correctly.
The sercond also but the third seems to be short on width.
2nd and 3rd divs are side by side in own div.
I have attached the htm file and style and you will be able to see what happenning.
cheers
<code>
#Layer1 {
position:absolute;
width:200px;
height:123px;
z-index:6;
left: 13px;
top: 161px;
}
#Layer2 {
position:absolute;
width:750px;
height:8px;
z-index:6;
}
#yellowContent {
width:500;
float:left;
background-color: #FFFF00;
font-family: Arial;
font-size: 0.70em;
color:#000000;
}
}
#yellowCol1 {
width:33%;
float:left;
padding-left:3;
padding-right:3;
}
#yellowCol2 {
width:67%;
float:right ;
padding-left:3;
padding-right:3;
}
#yellowCol3 {
width:50%;
float:left;
padding-left:3;
padding-right:3;
background-color: #FFFF00;
}
#yellowCol4 {
width:50%;
float:right;
background-color: #FFFF00;
padding-left:3;
padding-right:3;
}
</code>
Sample.html here
<code>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="RRS/style.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="Layer1">
<div id="Layer2">
<div id=yellowContent>
<div id=yellowCol1>
<p>Brief</p>
<p>Magnus es,Magnus es, domine, et laudabilis valde: magna virtus tua,
et sapientiae tuae Magnus es,Magnus es, domine, et laudabilis valde:
magna virtus tua, et sapientiae tuaeagnus es,Magnus es, domine, et laudabilis
valde: magna virtus tua, et sapientiae tuae Magnus es,Magnus es, domine,
et hghghg hghh sadasdasdas </p>
<p> </p>
</div>
<!-- 2 right hand columns (yellow content page) -->
<div id=yellowCol2>
<div id=yellowCol3>
<p> Project Data</p>
<p>Magnus es,Magnus es, domine, et laudabilis valde: magna virtus tua,
et sapientiae tuae Magnus es,Magnus es, domine, et laudabilis valde:
magna virtus tua, et sapientiae tuaeagnus es,Magnus es, domine, et
laudabilis valde: magna virtus tua, et sapientiae tuae Magnus es,Magnus
es, domine, et hghghg </p>
</div>
<div id=yellowCol4>
<p>Magnus es,Magnus es, domine, et laudabilis valde: magna virtus tua,
et sapientiae tuae Magnus es,Magnus es, domine, et laudabilis valde:
magna virtus tua, et sapientiae tuaeagnus es,Magnus es, domine, et
laudabilis valde: magna virtus tua, et sapientiae tuae Magnus es,Magnus
es, domine, et</p>
<p> </p>
</div>
</div>
</div>
</body>
</code>
