IE7 and IE8: Float clearing without adding empty elements

Question

I\'m having a problem similar to the one described here (without a resolution):

IE7 float and clear on the same element

The following HTML renders as intende

Answer 1

I sort of agree with the table option. But, you can do it with an empty list item. This would let you get rid of the 'clear' attribute in the 'right' and 'middle' classes. You would also need a 'solo' class for the single item to be sure it clears both ways.

.clear {
    clear: both; 
    margin:0px;
    padding:0px ;
    font-size:1px;
}
.solo {
    clear: both; 
}

1
 

2
 
3