# CSS - Mozilla DIV bottom padding anomaly? **URL:** \ **Category:** Factual Questions\ **Created:** [April 9, 2008, 10:18am UTC](https://boards.straightdope.com/t/css-mozilla-div-bottom-padding-anomaly/444583 "2008-04-09T10:18:12Z")\ **Posts on this page:** 7\ **Page:** 1
**Author:** ![jjimm](https://avatars.discourse-cdn.com/v4/letter/j/ba8739/32.png) [@jjimm](https://boards.straightdope.com/u/jjimm)\ **Post date:** [April 9, 2008, 10:18am UTC](https://boards.straightdope.com/t/css-mozilla-div-bottom-padding-anomaly/444583/1 "2008-04-09T10:18:12Z")
I’m trying to design a website without using tables (why do I torture myself so?). I’ve encountered a strange anomaly in Mozilla rendering of DIVs and Googling has proved fruitless. If I have a DIV wrapping around an image with zero padding, it renders as expected in IE 6 and 7 - namely the DIV finishes at the bottom of the image. However, in Mozilla-based browsers, and the new Safari for Windows, there’s a 5px pad at the bottom of the DIV. [Here’s](http://www.crowaptok.com/test/test2.html) a proof of concept. The code has nothing extraneous in it: ```auto
``` but whatever I do - I have tried absolute height, I have tried negative padding - the padding is still there. At this rate I’m going to have to swallow my pride and go back to tables, as my design is dependent on zero padding. Is this a known bug? Is there a workaround? ---
**Author:** ![GuanoLad](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/guanolad/32/42_2.png) [@GuanoLad](https://boards.straightdope.com/u/GuanoLad)\ **Post date:** [April 9, 2008, 11:25am UTC](https://boards.straightdope.com/t/css-mozilla-div-bottom-padding-anomaly/444583/2 "2008-04-09T11:25:46Z")
I used to encounter bugs like that when there was a line break in the code. But you don’t appear to be victim of that one. Try putting in “px” after each of the numbers, though. You have height as 260, but if you don’t specify pixels it can mess you around. You should also have a more detailed declaration, to specify the strict or transitional HTML you are using. ---
**Author:** ![GuanoLad](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/guanolad/32/42_2.png) [@GuanoLad](https://boards.straightdope.com/u/GuanoLad)\ **Post date:** [April 9, 2008, 11:30am UTC](https://boards.straightdope.com/t/css-mozilla-div-bottom-padding-anomaly/444583/3 "2008-04-09T11:30:56Z")
There. Just tested it. First, remove the height from the border, then include a Transitional doctype declaration. !DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN” “[http://www.w3.org/TR/html4/loose.dtd](http://www.w3.org/TR/html4/loose.dtd)” ---
**Author:** ![jjimm](https://avatars.discourse-cdn.com/v4/letter/j/ba8739/32.png) [@jjimm](https://boards.straightdope.com/u/jjimm)\ **Post date:** [April 9, 2008, 11:40am UTC](https://boards.straightdope.com/t/css-mozilla-div-bottom-padding-anomaly/444583/4 "2008-04-09T11:40:18Z")
Thanks for that, it worked! I didn’t mean to include the version with the height definition as the sample. FTR that was an error - I even chewed out one of my underlings for omitting the units in a CSS file last week - and I had earlier included “px” in and it didn’t work either. The only worry I have now is that the loose.dtd might mess up the box model bug in IE6, for which I was a declaring “rigid” (or whatever it is) DTD that was messing up the “margin: auto;” DIV centring in the actual page I’m working on. I shall have to find a computer with IE6 on it and test that with “loose.dtd” declared. ---
**Author:** ![GuanoLad](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/guanolad/32/42_2.png) [@GuanoLad](https://boards.straightdope.com/u/GuanoLad)\ **Post date:** [April 9, 2008, 11:48am UTC](https://boards.straightdope.com/t/css-mozilla-div-bottom-padding-anomaly/444583/5 "2008-04-09T11:48:25Z")
That’s IE for you. Better to use correct HTML with fixes for the IE bugs, than the other way around. ---
**Author:** ![jjimm](https://avatars.discourse-cdn.com/v4/letter/j/ba8739/32.png) [@jjimm](https://boards.straightdope.com/u/jjimm)\ **Post date:** [April 9, 2008, 11:58am UTC](https://boards.straightdope.com/t/css-mozilla-div-bottom-padding-anomaly/444583/6 "2008-04-09T11:58:42Z")
Thanks again, it’s looking good. Does anyone know of a service that allows you to see a site as IE6 would? ---
**Author:** ![GuanoLad](https://sea3.discourse-cdn.com/straightdope/user_avatar/boards.straightdope.com/guanolad/32/42_2.png) [@GuanoLad](https://boards.straightdope.com/u/GuanoLad)\ **Post date:** [April 9, 2008, 12:14pm UTC](https://boards.straightdope.com/t/css-mozilla-div-bottom-padding-anomaly/444583/7 "2008-04-09T12:14:45Z")
> **[Free Software PNG Images with Transparent Backgrounds - FastPNG.com](https://fastpng.com/software)** > > Download Software PNG images 100% Free incl. transparent background Software PNGs. Get 200+ High Quality Software PNGs with many resolutions. > **[browsers.evolt.org](https://browsers.evolt.org/?ie%2F32bit%2Fstandalone)** > > A world community for web developers, evolt.org promotes the mutual free exchange of ideas, skills and experiences.