IE float/clear issue - elements not aligning "properly"

I know this topic has been covered in a number of different ways...but
I can't seem to find a solution that fixes the issue I'm having:

http://www.ericmmartin.com/code/css/float-clear.html

IE6 & 7 renders the element with class arrow correctly, but the other
elements all seem to stack up in one row, seemingly ignoring the clear
property.

What am I missing?

On Feb 29, 9:31 am, Eric Martin <emarti... (AT) gmail (DOT) com> wrote:

I know this topic has been covered in a number of different ways...but
I can't seem to find a solution that fixes the issue I'm having:

http://www.ericmmartin.com/code/css/float-clear.html

IE6 & 7 renders the element with class arrow correctly, but the other
elements all seem to stack up in one row, seemingly ignoring the clear
property.

What am I missing?

I ended up "fixing" this by changing my HTML. I remove the clear
property on the "arrow" div and added a <br/> element with the clear
property.

In article
<f832dcc0-490d-4bde-9c41-3c21de35a092 (AT) i7g2000prf (DOT) googlegroups.com

,
Eric Martin <emartin24 (AT) gmail (DOT) com> wrote:

I know this topic has been covered in a number of different ways...but
I can't seem to find a solution that fixes the issue I'm having:

http://www.ericmmartin.com/code/css/float-clear.html

IE6 & 7 renders the element with class arrow correctly, but the other
elements all seem to stack up in one row, seemingly ignoring the clear
property.

What am I missing?

This what you want:

http://netweaver.com.au/test/eric/eric.html

?

(Sure you don't want a table for this instead?)

--
dorayme

On Feb 29, 2:19 pm, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:

In article
f832dcc0-490d-4bde-9c41-3c21de35a... (AT) i7g2000prf (DOT) googlegroups.com>,

Eric Martin <emarti... (AT) gmail (DOT) com> wrote:

I know this topic has been covered in a number of different ways...but
I can't seem to find a solution that fixes the issue I'm having:

http://www.ericmmartin.com/code/css/float-clear.html

IE6 & 7 renders the element with class arrow correctly, but the other
elements all seem to stack up in one row, seemingly ignoring the clear
property.

What am I missing?

This what you want:

http://netweaver.com.au/test/eric/eric.html

Thanks for your help dorayme. Unfortunately, once you give the "arrow"
div a height and width, it breaks the positioning - the following
elements. Adding a float:left fixes it in every browser except IE.

(Sure you don't want a table for this instead?)

I'm sure I ended up just adding a <br/> before the "arrow" div and
everything works as desired now.

In article
<05369795-8b82-4c02-8622-493d73ca6446 (AT) i29g2000prf (DOT) googlegroups.co
m>,
Eric Martin <emartin24 (AT) gmail (DOT) com> wrote:

On Feb 29, 2:19 pm, dorayme <doraymeRidT... (AT) optusnet (DOT) com.au> wrote:
In article
f832dcc0-490d-4bde-9c41-3c21de35a... (AT) i7g2000prf (DOT) googlegroups.com>,

Eric Martin <emarti... (AT) gmail (DOT) com> wrote:

I know this topic has been covered in a number of different ways...but
I can't seem to find a solution that fixes the issue I'm having:

http://www.ericmmartin.com/code/css/float-clear.html

IE6 & 7 renders the element with class arrow correctly, but the other
elements all seem to stack up in one row, seemingly ignoring the clear
property.

What am I missing?


Thanks for your help dorayme. Unfortunately, once you give the "arrow"
div a height and width, it breaks the positioning - the following
elements. Adding a float:left fixes it in every browser except IE.


(Sure you don't want a table for this instead?)

I'm sure I ended up just adding a <br/> before the "arrow" div and
everything works as desired now.

Yes, there should have been a float: left on the arrow div. I
just happened to be on my Winbox and it did what you wanted on my
box. But anyway, a br will certainly do the job for the look you
want. (I have taken the url down now...)

--
dorayme