Using :after to clear float elements causes problem in IE 6 and 7

28 views
Skip to first unread message

Ian

unread,
Nov 11, 2011, 6:23:56 AM11/11/11
to ie7-js
div:after {
content: ".";
clear: both;
display: block;
height: 0;
visibility: hidden;
}


The above code is used popularly to clear float elements. But it
causes layout problem in IE 6 and 7 because the generated element in
IE 6 and 7 doesn't behave correctly. Is there a workaround?

Ian

unread,
Dec 6, 2011, 7:38:26 AM12/6/11
to ie7-js
I had just tested it again. The result is fine.

P.S. IE7 needs "line-height: 0; font-size:0;" to prevent jumpy space
issue. Thanks Davey Faherty for the help.

Reply all
Reply to author
Forward
0 new messages