I want to float a list so:
-------------------------------------
1. Text 2. More text
-------------------------------------
3. Text 3 4. Text that wraps
onto another line
-------------------------------------
5. Text 5 6. Text 6
with borders on top of each list element so that 1 and 2, 3 and 4, 5
and 6 are all aligned with each other regardless of what each element
contains.
I've got classes of even and odd applied to the alternating <li>
elements (starting with even for computer sciency reasons) and so
would assume that
li { float: left; width: 50%; }
li.even { clear: both; }
would do the trick. Although obviously it doesn't ;) We see the
usual IE right column elements rising up horror.
My google foo has failed me and I'm finding it hard to believe that
this is the best solution I can come up with (I'm sure I've done this
before better), but that would seem to be the case:
http://fu2k.org/alex/css/cssjunk/floats-unequal-heights
In a nutshell, unfloat the list elements in the right column for IE
and use margin-left to shunt them over (and negative margin-right to
make the borders overlap and not have a gap between them).
Anyone got a better solution please?
______________________________________________________________________
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/
