Forum Moderators: not2easy
code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>letter a test</title>
<style type="text/css">
#total {width:1000px; position:relative;}
#lettera {width:400px; position:absolute; right:600px; left:00px;}
#letterb {width:400px; position:absolute; right:200px; left:400px;}
#letterc {width:200px; position:absolute; right:00px; left:600px;}
</style>
</head>
<body>
<div id="total">
<div id="lettera">
<p>sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text </p>
</div>
<div id="letterb">
<p>sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text </p>
</div>
<div id="letterc">
<p>sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text sample text </p>
</div>
</div>
</body>
</html>
I think you meant to use left:800px on #letterc
If no such parent is found, it will use the viewport as a reference.
but absolute also takes the element itself out of the flow.
position:relative;@dukelips if you try to absolutely position the overall container you may run into scroll issues/hidden content as you will in effect have removed the entire layout from the flow of the document, there's no reason not to use position relative in this case, though position absolute on the wrapper will intially produce the same effect.
position: absolute;position: relative;
