html - IE 6/7 float height issue -
i have 6 li elements floated appear in 2x3 grid:
1 2 3 4 5 6
looks fine in except ie 6/7, there looks like:
1 2 3 4 5 6
the css have is:
ul { margin: 0; padding: 0; width: 900px; overflow: hidden; } li { list-style: none; width: 278px; float: left; margin-left: 12px; line-height: 1.6em; padding-bottom: 20px; }
items 1 , 4 have these styles on them:
li.row_start { margin-left: 0; clear: both; }
the problem (i'm guessing) content in li containers can have variable height depending on content inside. in example, item 2 have larger height 1 , 3 when item 5 trying float left, hitting height/padding of item 2.
your guess right on. real way ensure layout want set height on items well.
Comments
Post a Comment