[css-d] Single floated list with forced row clear in IE

2008-04-15 Thread Timothy Kelty
Having trouble with this one...

Example here: http://geniuscar.com/old/tests/iefloat.html

I just have a single UL with all the LIs all floated left.  I want to
be able to force a second row at a given point in the list, so I
applied a clear:left to first element I want in the 2nd row.

This behaves like I expect in FFox and Safari, with the cleared LI on
the 2nd row and following LIs also on the 2nd row.  In IE however, LIs
following the clear get bumped up and are placed in the first row.

I've gone through my bag of tricks and can't figure it out in IE, any ideas?
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/


Re: [css-d] Single floated list with forced row clear in IE

2008-04-15 Thread Bruno Fassino
On Tue, Apr 15, 2008 at 6:16 PM, Timothy Kelty wrote:

 Example here: http://geniuscar.com/old/tests/iefloat.html

 I just have a single UL with all the LIs all floated left.  I want to
 be able to force a second row at a given point in the list, so I
 applied a clear:left to first element I want in the 2nd row.

 This behaves like I expect in FFox and Safari, with the cleared LI on
 the 2nd row and following LIs also on the 2nd row.  In IE however, LIs
 following the clear get bumped up and are placed in the first row.


In IE7 (and below) when a box has both the float and the clear
properties (as your cleared LI) many wrong behaviors occur, see [1].
At the moment the only fix that I see for your case consists in adding
in the HTML an empty not floated LI before the cleared one. Sure not a
nice solution. It seems not to create problem in other browsers,
anyway you could feed it just to IE, with a CC. So you could use:

...
  liRow One/li
  !--[if lt IE 8]li style=float:none/li![endif]--
  li class=twoRow Two (item 1)/li
...


Best regards,
Bruno

[1] http://brunildo.org/test/IEWfc2.html

-- 
Bruno Fassino http://www.brunildo.org/test
__
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/