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

Add email recipient to all new Trac tickets -

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

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