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

Popular posts from this blog

asp.net - repeatedly call AddImageUrl(url) to assemble pdf document -

java - Android recognize cell phone with keyboard or not? -

iphone - How would you achieve a LED Scrolling effect? -