Space at bottom of images in Firefox

When Firefox displays images on XHTML pages it leaves an empty margin beneath them. Setting padding and margin to 0 does nothing. Note that the problem is exclusive to XHTML

Solutions are:

  1. Remove the doctype statement from the top of XHTML code. This will force Firefox to treat your page as a common tag soup and the space will disappear.
  2. Add display: block; to image style.
Tagged:
html
css

Comments

  • Gravatar
  • sam
  • 2009-03-19 00:20:59
oh wow this is a exactly my fix, thanks a bunch!!
  • Gravatar
  • Spiel
  • 2009-02-06 18:45:47
You are the wind beneath my wings! Why won't Firefox fix that stupid bug?!?
  • Gravatar
  • lgespee
  • 2008-12-05 11:37:01
It is if I am correct the W3C standard. The image is vertically aligned to the baseline, for characters like j, y, p etc. there is a spacing below the baseline to display their "feet". If you set the image to be vertically aligned to the bottom of the containing element, it will display just fine. img { vertical-align : bottom; }
  • Gravatar
  • DeltaPower
  • 2008-03-28 09:20:27
Never thought #2 was the cure, thanx!
  • Gravatar
  • Paul
  • 2008-02-08 15:52:31
Super ... Thanks Thank you very much for this working solution ...
  • Gravatar
  • Ellen
  • 2008-01-20 16:08:11
Just What I Needed Thanks. I was considering coloring the background in the div with the image, but solution 2. took care of it.
  • Gravatar
  • Matt Harris
  • 2008-01-01 04:59:33
Posh Magazine Designer Lovely! Saves me from having to hardcode the height into the Div....it was a nightmare.
  • Gravatar
  • Nissar
  • 2007-12-03 03:39:41
Great help! Thanks for the great help!
  • Gravatar
  • Dave Stewart
  • 2007-11-24 13:08:10
Nice one! I googled "firefox image margin" and up this page came. Great!!
  • Gravatar
  • phil
  • 2007-11-21 12:51:14
Thanks! Thanks!
  • Gravatar
  • t_seq
  • 2007-10-15 08:32:58
thanks awesome, #2 did the trick.
  • Gravatar
  • pestaa
  • 2007-07-31 07:01:59
Thank you very much! This is exactly what i'm searching for.
  • Gravatar
  • Andres
  • 2007-01-10 15:23:36
thanks work correctly!!
  • Gravatar
  • larz
  • 2006-11-10 02:57:56
thanks so much! this problem was giving me a serious headache. thanks!
  • Gravatar
  • Chris Majewski
  • 2006-09-05 14:33:53
Bingo... So I wasn't nuts.. it _was_ firefox's xhtml parser.

© 2003 — 2014 Akinas
All rights reserved