So I have a footer made up of a list, these are floating left and after 5 items I want a new line started.This works in all browsers but not in IE7.So what I have done is that on the 6 item i.e. first item on second line is added a class..\[code\] .liClearLeft { clear: left;}\[/code\]The problem is that IE7 even though the second line is floating left, the height is off and they are not aligned vertically the same, it seems to depend on the height of the 1st row. So I am guessing I am wondering how in IE7 do I get rows to be aligned vertically as well ?Code\[code\]<div id="footerContainer" class="clearfix"><div class="container"> <div id="footerMainMenu" class="clearfix"> <asp:Repeater ID="footerMenuRepeater" runat="server" onitemdatabound="FooterMenuRepeaterItemDataBound"> <HeaderTemplate> <ul id="mainMenuList"> </HeaderTemplate> <ItemTemplate> <li class="footerParentSubLists <%# ((FooterMenuItem)Container.DataItem).MenuTitleBoldClass %> <%# Container.ItemIndex == 5 ? "liClearLeft" : string.Empty %>"> <div id="footerMenuDiv"> <a class="footerMenuHeader" href='http://stackoverflow.com/questions/14061648/<%# ((FooterMenuItem)Container.DataItem).CallToActionLink %>'><%# ((FooterMenuItem)Container.DataItem).Title %></a> </div> <asp:Repeater ID="subItemRepeater" runat="server"> <HeaderTemplate> <ul class="footerChildSubList"> </HeaderTemplate> <ItemTemplate> <li><a class="footerMenuItems <%# ((FooterMenuItem)Container.DataItem).ArrowClass %>" href="http://stackoverflow.com/questions/14061648/<%# ((FooterMenuItem)Container.DataItem).CallToActionLink %>"><%# ((FooterMenuItem)Container.DataItem).Title %></a> </li> </ItemTemplate> <FooterTemplate> </ul> </FooterTemplate> </asp:Repeater> </li> </ItemTemplate> <FooterTemplate> </ul> </FooterTemplate> </asp:Repeater> </div>\[/code\]CSS :\[code\].footerParentSubLists {float: left; width: 170px; max-width: 170px; margin-right: 20px !important;}.footerChildSubList { margin: 0px;position: relative;}\[/code\] e