See that extra space in IE7 between my h2 and img here...

http://www.gupdesigns.com/temp/debug.html

 

It doesn't happen in Firefox.

 

How to get rid of that space to match what I see in Firefox?

 

My code is simple...

 

<body>
<h2 style="margin: 0; padding: 0;">This is my H2</h2>
<img src="images/rightdivider.gif" />
</body>

 

What funny bug is this called? Because it is hard to search for things in Google when you don't know what it is called.

remove the "new line" character (represented as \n technically, but displayed a line break).

remove the "new line" character (represented as \n technically, but displayed a line break).

 

Thanks. I have tried that, but didn't work.

 

Do a "view source" on my page and see that the img is right next to the h2 on the same line.

and there is a margin/padding=0 on the image as well?

 

if so, its a conundrum...

 

i know this is definitely a "no", but is the image itself free of whitespace.

I'd guess it's the line-height that does it.

 

Can't you place the image is a background image of the H2 element? I looks like a layout image, in which case it fits better in CSS.

id say put the image as a background image for h2

I have figured out the workaround....

 

<body>
<h2 style="margin: 0; padding: 0; display:inline;">This is my H2</h2>
<div><img src="images/rightdivider.gif" /></div>
</body>

 

I set the h2 as inline and wrap the image in a div.

I have figured out the workaround....

 

<body>
<h2 style="margin: 0; padding: 0; display:inline;">This is my H2</h2>
<div><img src="images/rightdivider.gif" /></div>
</body>

 

I set the h2 as inline and wrap the image in a div.

Or just set the IMG element at block element.

The page is not loading for me. I get a 404 error.