Position: sticky with bottom: 0 not creating parent element space when used inside a flexbox element
Categories
(Core :: Layout: Flexbox, defect)
Tracking
()
People
(Reporter: hello, Unassigned)
Details
User Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.93 Safari/537.36
Steps to reproduce:
Create a sticky footer using postion: sticky; bottom: 0; inside an element with display: flex; flex-direction: column
Codepen demo:
https://codepen.io/bluefantail/pen/xxqwddZ
Actual results:
The sticky element is blocking the area behind it - meaning the last line of text can't be scrolled into view.
Expected results:
I'd expect position: sticky to create the extra space in the parent element needed to make sure the sticky element doesn't block content underneath - and behave the same way as the block-level element.
|
||
Comment 1•5 years ago
|
||
The Bugbug bot thinks this bug should belong to the 'Core::Layout: Flexbox' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.
|
||
Comment 2•5 years ago
|
||
Thanks for the bug report! This is likely a version of bug 1377072, which hopefully we can get to fixing before too long.
(In reply to Daniel Holbert [:dholbert] from comment #2)
Thanks for the bug report! This is likely a version of bug 1377072, which hopefully we can get to fixing before too long.
*** This bug has been marked as a duplicate of bug 1377072 ***
No problem! Glad to hear it's on the radar, I searched but for some reason never came across that one - thanks!
Description
•