[css-grid] display: grid does not work as expected when applied to buttons
Reported by
t...@onesignal.com,
Aug 24 2017
|
|||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_12_6) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/60.0.3112.101 Safari/537.36 Steps to reproduce the problem: 1. open chrome_button_grid_just_bug.html 2. notice the child elements are not inline even though display grid is applied What is the expected behavior? chrome_button_grid.html contains the bug and other examples where the child elements are displayed inline (correctly) What went wrong? display grid does not appear to be applied correctly to buttons Did this work before? No Does this work in other browsers? Yes Chrome version: 60.0.3112.101 Channel: n/a OS Version: OS X 10.12.6 Flash Version:
,
Aug 25 2017
The problem is that Chrome implements the Button element as a Flexible Box independently of the value its display property. I'm not sure about the validity if this bug, but in any case, thanks for reporting it.
,
Aug 25 2017
I can confirm that Firefox renders the Button element as Grid in this case, so perhaps we have an interoperability issue.
,
Aug 28 2017
tim@ thanks for the issue. Able to reproduce this issue on Windows-7, Ubuntu 14.04 and Mac OS 10.12.6 using chrome latest stable 60.0.3112.113 and canary 62.0.3198.0 with the below steps 1. Launched Chrome and clicked on the given .html files. 2. Could observe that the elements are not inline. Please find the attached screen shots of the behaviors in Chrome and Firefox. This is a Non-regression issue which is observed since 45.0.2454.103 chrome version. Thanks
,
Aug 28 2017
,
Sep 4 2017
Not 100% sure but this might be related to bug #375693, which was fixed in WebKit by https://trac.webkit.org/changeset/213455/webkit
,
Jun 26 2018
,
Jan 15
I wrote a wpt for this as part of https://github.com/web-platform-tests/wpt/pull/14824 |
|||||
►
Sign in to add a comment |
|||||
Comment 1 by rsesek@chromium.org
, Aug 25 2017