CSS cross browser compatability problems

hi

so i am trying to rebuild a site in CSS and aside from a few glitches(!) i thought that all was going well (in IE) until i looked at the site in mozilla and opera (which i've since learnt are the ones that handle it well -- oops!)

in IE everything lays out as it should but in the two mentioned above elements just collapse onto each other, for example

here!!

i'm using an external style sheets and i guess the css that matters is the following...

.textBox {
position: relative;
top: 0px;
left: 20px;
padding: 0px;
background: #F2FCFF;
width: 640px;
height: 5px;
overflow: visible;
}

.quoteBoxlg {
padding: 10px;
position: relative;
top: 0px;
left: 100px;
padding: 10px;
background: #FFFFFF;
width: 65%;
height: 20px;
overflow: visible;
}

and

.floatleft {
float: left;
margin: 0 0 15px 15px;
}

please help if you can!

thanks

jim

this happens because ie rendres the overflow:visible wrong.
http://www.quirksmode.org/css/overflow.html

one way to fix it is to remove the
overflow:visible, and height property
form the .textBox and .quoteBoxlg

thanks Akh...

i'll give that a go now.

jim

well it's got me part of the way there so thanks for that...

however the textBox and quoteBox elements still sit above the floatleft element.

cheers,

jim

try to set an margin-left to the .textBox,

ie.
margin-left:70px;

It works and you are a star! thanks so much....

jim