504084 - An <h1> with margin and padding set to zero still appears to have padding (space for descenders under image)

Status: RESOLVED INVALID

(Core :: Layout: Block and Inline, defect)

Description

[justin]

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.1) Gecko/20090624 Firefox/3.5 (.NET CLR 3.5.30729)
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 6.0; en-US; rv:1.9.1) Gecko/20090624 Firefox/3.5 (.NET CLR 3.5.30729)

<h1 style="padding: 0; margin: 0; border: 1px solid black;"><img src="..."></h1>

Reproducible: Always

Steps to Reproduce:
Please see attached test case.
Actual Results:  
Space appears between the bottom of the image and the border of the heading.

Expected Results:  
The top and bottom border of the heading should be flush against the top and bottom of the image.

Workaround is to set the height of the heading to the height of the image.

Comment 1

[justin]

Attachment: Test case

Comment 2

[justin]

Attachment: Image for test case

Should be placed in the same directory as margin.html

Comment 3

[David Baron :dbaron: (⌚️UTC-5, no longer working on Mozilla)]

That's because the image is sitting on the baseline of the text; there's room for descenders underneath it.  You might get the results you expect if you use 'vertical-align: top' or 'vertical-align: bottom' on the image.

Comment 4

[justin]

Whoops. Sorry, my bad. Was getting confused with the different implementations out there and wasn't sure which was the correct one.