Code: Select all
<div style="width: 400px;"> <div style="background: red; float: left; clear: both;">Top left</div> <div style="background: blue; float: right; clear: both;">Bottom right</div></div>In all browsers except IE 6 (that I have access to on my Mac) this works. In IE 6, the boxes end up on the same row as each other. Why?
My "real world" problem is actually a list where each <li> goes left/right to give the impression of a conversation (speech bubbles coming from the left and responses from the right).