Mark,
Thanks for the information.
But I am still having a very hard time coding css based table-less designs becuase the results vary from browser to browser.
The code below works well in Firefox but when I view this in IE6, it is not the same. Problem is: In the right column (#right), the upper part of content ( i.e. content with width equal to the width of left side content) gets slided to the right by a pixel or two.
Code:
<HTML>
<HEAD>
<STYLE>
body
{
margin:0;
padding:0;
background-color:#a0a0a0;
}
#cont
{
margin:0;
padding:0;
width:750px;
background: url(images/bodybg.gif) repeat-y;
}
#left
{
width:200px;
margin:0;
padding:0;
float:left;
}
#right
{
margin:0 0 0 200px;
padding:0;
}
.clear {
clear: both;
margin: 0;
padding: 0;
}
</STYLE>
</HEAD>
<body>
<DIV ID="cont">
<div id="left">Sed mollis aliquam ante. Proin massa. Etiam scelerisque quam vel tortor. Aenean quis justo. Duis nec quam. Pellentesque porttitor lorem vitae orci. </DIV>
<DIV id="right">Curabitur non justo at dui lobortis ultricies. Fusce odio tellus, vulputate eu, mattis ac, tincidunt ut, purus. Fusce eget lacus. Donec nibh odio, ullamcorper ut, venenatis molestie, placerat a, sapien. Donec turpis. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse potenti. Aliquam facilisis, pede ac placerat ultricies, dolor lectus tempus elit, eget fringilla magna elit et pede. Etiam eu sem. Vivamus lobortis, urna nec condimentum rutrum, est lorem euismod risus, id lobortis dui magna nec nisi. Donec laoreet, enim sit amet volutpat faucibus, sapien leo gravida nunc, et ultrices nibh magna sed eros. Quisque sem nisi, euismod ac, elementum eget, auctor id, magna. Nunc lectus. Vivamus viverra neque non leo. Sed scelerisque lectus eget arcu hendrerit blandit. Sed purus velit, hendrerit nec, tristique ut, ullamcorper id, nunc. Vestibulum pretium, nisl eu tempus facilisis, justo metus rutrum ipsum, nec sagittis eros risus nec ante.
Mauris tempor nisi sit amet diam pretium fringilla. In lorem. Mauris pharetra quam quis neque. Sed mollis aliquam ante. Proin massa. Etiam scelerisque quam vel tortor. Aenean quis justo. Duis nec quam. Pellentesque porttitor lorem vitae orci. Aliquam lobortis ultricies nibh. Morbi porta nulla. Integer est diam, commodo vitae, pellentesque et, tincidunt in, risus. Suspendisse tempor risus vel massa. Proin condimentum scelerisque sem. Aliquam nec nisi nec urna tempor sodales. Etiam malesuada suscipit metus.</DIV>
<div class="clear"></div>
</DIV>
Not sure how to fix this. Please suggest.
Thanks Viv.
Bookmarks