[css-grid] Item with percentage height and overflow scroll not working fine on a 1fr grid row
Reported by
n.nafran...@digitalhorizon.ru,
Sep 28
|
|||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_14_0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/69.0.3497.100 Safari/537.36 Steps to reproduce the problem: 1. go to https://codepen.io/dimensi/pen/pxoLNv 2. open in chromium What is the expected behavior? Overflow must work What went wrong? Overflow no working and flexbox wrong calculating child items Did this work before? No Does this work in other browsers? Yes Chrome version: 69.0.3497.100 Channel: stable OS Version: OS X 10.14.0 Flash Version: Check how it's work in firefox
,
Sep 30
,
Sep 30
,
Oct 2
Hi, Want to look into this, can you assign?
,
Oct 3
I'm fine if you want to take a look, there seem to be issues in Chromium and Firefox. I cannot assign it to you, so I'm adding myself as owner, but I won't be working on this, I'd just be following your progress here. Check this example: https://jsbin.com/fawabav/1/edit?html,css,output I believe behavior in 2.A) is wrong in Chromium. And behavior in 1.B) is wrong in Firefox. The problem is that a "1fr" row is equivalent to "minmax(auto, 1fr)", and the item has by default "min-height: auto", so that forces the row to be as tall as the item's height. Then when you have scrollbar "min-height: auto" doesn't apply, so the row should only use the avialable space.
,
Oct 3
Mmmm, probably I spoke too fast. When we have "height: 100%" on the item, I don't think the "min-height: auto" should have any effect. So 1.A) is probably bad in Chromium and Firefox. 2.A) seems wrong in Chromium too. All this stuff is quite complex, so we need to debug properly the track sizing algorithm to understand the issue.
,
Jan 9
|
|||||
►
Sign in to add a comment |
|||||
Comment 1 by robliao@chromium.org
, Sep 29Labels: -OS-Mac