CSS Paddings collapse in certain circumstances

RESOLVED DUPLICATE of bug 748518

Status

()

Core
Layout: Block and Inline
RESOLVED DUPLICATE of bug 748518
2 years ago
2 years ago

People

(Reporter: joshwise1994, Unassigned)

Tracking

({testcase})

41 Branch
testcase
Points:
---

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [parity-chrome], URL)

(Reporter)

Description

2 years ago
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_10_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2454.99 Safari/537.36

Steps to reproduce:

Create a parent element with "position: absolute", "top: 0", "left: 0", "right: 0", "bottom: 0", "overflow-y: auto", and "padding: 60px".

Then, give it a child element with "padding-bottom: 60px", and enough text content to overflow the parent and cause a scrolling behavior.

As seen here: http://jsfiddle.net/8nyh510w/3/


Actual results:

The bottom paddings of the parent and child collapse and overlap each other. This is NOT the behavior in Chrome or IE11.


Expected results:

The child's bottom padding should sit underneath the text content, inside the parent's content box, resulting in more scrollable area. The child's bottom padding should NOT collapse into the parent's bottom padding.

Comment 1

2 years ago
Mozilla/5.0 (Windows NT 6.1; Win64; x64; rv:44.0) Gecko/20100101 Firefox/44.0
20150928030206

I get the same result in IE 11.
Component: Untriaged → Layout: Block and Inline
Keywords: testcase
OS: Unspecified → All
Product: Firefox → Core
Hardware: Unspecified → All
Whiteboard: [parity-chrome]
Status: UNCONFIRMED → RESOLVED
Last Resolved: 2 years ago
Resolution: --- → DUPLICATE
Duplicate of bug: 748518
You need to log in before you can comment on or make changes to this bug.