no

How to Remove the Extra Space Added by Ie Browser on Div Tags

I just want to put an image inside a div like this: <div> <div> <img src="image.jpg" alt="Image" /&g...

I just want to put an image inside a div like this:


<div>
<div>
<img src="image.jpg" alt="Image" />
</div>
</div>


Seems easy right? Unfortunately, it took me 15 minutes to figure out that the IE browsers are inserting an extra space in the bottom, just after the image. And whatever margin or padding values I set, it's useless.

Conclusion:
IE treats line-break as whitespace so you better remove it. Or put an empty comments inside the div and IE will not put extra space.

So the final tags are:

<div>
<div><!-- empty --><img src="image.jpg" alt="Image" /></div>
</div>

Related

web 4825667313828162096

Post a Comment Default Comments

Outsourcing

Are you looking for freelancers in the Philippines? Get in touch.

Donations

If you like what I do, you can support this channel by buying me a coffee. I would be grateful for your contribution! Your donations will help me create more FREE online courses and learning materials for programmers and remote workers.

item