ansaurus

Question

Background Color and Italics sets off Internet Explorer 7 bug

Answer 1

+1 A:

Not sure why it's happening, but there are many ways of making sure it doesn't, including adding display: inline-block to the em.

Adam Hepton 2009-07-27 09:16:36

thanks, this lets me fix all instances of the problem once in my stylesheet, as opposed to adding margin to who-knows-where-all.

Ian 2009-07-27 18:06:38

... actually, this doesnt fix it because now all my em's start on their own line. what is another method to fix this issue?

Ian 2009-07-27 19:08:37

zoom: 1 css corrects this issue without affecting any other layout.

Ian 2009-07-27 19:19:49

Answer 2

+3 A:

This is happening because of the floated image.

When an image is floated it technically does not have any layout of its own. The white bars are the <p> tags, since in CSS you gave them a background of #FFF.

For IE7 is thinks the <p> tags are actually starting at the start of the page on the far left, so it starts them there, but simply bumps the content past the floated image, leaving funny white bars overtop of the floated image.

I would try getting around it by giving your <p> tags left margin. If you make enough left margin to get past the image you shouldn't get those bars anymore.

So try something like...

p{ background-color: #fff; margin-left: 300px; }

You can adjust the left margin but something along those lines should get rid of the white bars for you.

Sir David of Lee 2009-07-27 13:02:05

You know, you could always just get rid of the background color on your p tags. Atleast in your example they dont really serve any purpose since the background is already white.If you just put all your content into some other element that has a background of #fff that could fix it as well.Adding inline-block to every element that might make a floated image look funny is a poor idea, if you just put margin on one general tag that you will use alot that would also fix the problem. Or just put your floated element inside the p tag with the other content.

Sir David of Lee 2009-07-28 15:48:00

ansaurus

tags:

views:

answers:

Background Color and Italics sets off Internet Explorer 7 bug

related questions