Top reasons your CSS columns are messed up - Warpspire
Popularity Report
 |
|||
|
|||
|
|||
|
|||
|
|||
|
Rank
URL Tag Cloud
Bookmark History
Saved by 39 people (-9 private), first by anonymouse user on 2008-05-14
- Scayla on 2009-10-27 - Tags ie6 , hack , tip , css
- Burnhard on 2009-10-23 - Tags css , css_layout , tips , web-entwicklung
- Dansmithatwork on 2009-10-23 - Tags css , column , float , clear
- Skyx433 on 2009-10-07 - Tags css , webdesign
- Redheadjed on 2009-09-18 - Tags no_tag
Public Sticky notes
Your margins are doubled in IE6
Highlighted by burnhard
Easy fix: add
display:inline; No side effects in any browser, and IE6 obeys margins perfectly.
Highlighted by burnhard
.columns{
width:500px;
}
.columns .main{
float:left;
width:400px;
overflow:hidden;
}
.columns .sidebar{
float:right
width:100px;
overflow:hidden;
}
Highlighted by bluecockatoo
Your margins extend past your container
Highlighted by burnhard
The fix? Apply a left margin to each item, with a negative margin to the wrapper.
Highlighted by burnhard
ul.listing{
margin:0 0 0 -20px;
width:420px;
}
ul.listing li{
list-style-type:none;
float:left;
margin:0 0 0 20px;
width:85px;
}
Highlighted by bluecockatoo
Public Comment