| Summary: | CSS align-items and justify-content are ignored when flex container is a button element | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|
| Product: | WebKit | Reporter: | Phil <pguerrant> | ||||||||
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> | ||||||||
| Status: | RESOLVED CONFIGURATION CHANGED | ||||||||||
| Severity: | Normal | CC: | dvpdiner2, facetothefate, hyatt, jonlee, m.kurz+webkitbugs, oliverjash, simon.fraser, webkit-bug-importer, zalan | ||||||||
| Priority: | P2 | Keywords: | InRadar | ||||||||
| Version: | Safari 10 | ||||||||||
| Hardware: | Unspecified | ||||||||||
| OS: | Unspecified | ||||||||||
| Attachments: |
|
||||||||||
Looks fine on Safari Version 11.0 (12604.1.38.1.7) Created attachment 321277 [details]
Test run on safari 11
Created attachment 328444 [details]
Screenshot of actual output of Safari 8
Note the attached test case image is wrong. It shows the expected output instead of the actual output. I have attached a corrected screenshot of the actual output on Safari 8.
This does appear to be fixed in Safari 11.
Thanks for the confirmation. |
Created attachment 304560 [details] Test Case See attached test case. The align-items and justify-content properties seems to be completely ignored when the flex container is a button. It doesn't seem to matter if the flex direction is row or column, or what value you use for align-items and justify-content - setting them does not affect any change whatsoever. Works as expected in Chrome, Firefox, IE11, and Edge. Fails only in Safari