Closed Bug 247761 Opened 20 years ago Closed 20 years ago

Inline element (span) with padding inside absolutely positioned div is positioned as if it has no padding

Categories

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

x86
Windows XP
defect
Not set
normal

Tracking

()

RESOLVED INVALID

People

(Reporter: moz, Unassigned)

Details

Attachments

(1 file)

User-Agent:       Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7) Gecko/20040614 Firefox/0.9
Build Identifier: Mozilla/5.0 (Windows; U; Windows NT 5.1; en-US; rv:1.7) Gecko/20040614 Firefox/0.9

When you have a div with absolute positioning that contains a span with padding
the span will be positioned as if it had no padding, that is the padding will be
rendered outside of the top of the containing div or overlap other elements of
the div.

Note: IE 6.0 does not increase the container div's height, but crops the padding
from extending outside of the div (div size is again as if the padding was not
applied to the span).

Reproducible: Always
Steps to Reproduce:
Load the testcase. 

Notes:   Black is the abs divs.
         Green are the div/spans contained inside.

-- Notice that the background caused by padding (top-green) is rendering above
the containing absolutly positioned div (black), instead of moving the span 
element (green) down.
-- Notice also that the containing div's height (black) is as if, again, there
was no padding applied to the span (green).

Actual Results:  
Padding, while being rendered, is not included in the span's height.

Expected Results:  
Span's height (and subsequently div's height) should include the padding with
span repositioned accordingly. (? - not sure if this is correct, but overflowing
out of container as it is now can't be right)
Attached file testcase
Testcase.  #1 shows the described issue.  2-4 show, for reference, the same
setup but: without padding, with a div and padding, and a div without padding
-- respectively.
Also occurs with divs that have display: inline (naturally...)
Summary: Span with padding inside absolutely positioned div is positioned as if it has no padding → Inline element (span) with padding inside absolutely positioned div is positioned as if it has no padding
This is how inline boxes work, and has nothing to do with absolute positioning.

See:
http://www.w3.org/TR/2004/CR-CSS21-20040225/visudet.html#inline-non-replaced
http://www.w3.org/TR/2004/CR-CSS21-20040225/visudet.html#line-height
Status: UNCONFIRMED → RESOLVED
Closed: 20 years ago
Resolution: --- → INVALID
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: