- From: Amelia Bellamy-Royds via GitHub <sysbot+gh@w3.org>
- Date: Tue, 01 Aug 2017 06:31:58 +0000
- To: public-css-archive@w3.org
Coming back to this & summing up my thoughts (some of which are also in the conclusions section of the linked test pen): The issue with percentage sizing in a shrink-wrapped container isn't really SVG or aspect-ratio specific: I've tested it with other types of elements (e.g., `<button>`, `<div>`), and still get cross-browser inconsistencies. So maybe that can be a separate issue and we can focus here on the "simpler" case of auto-sizing and aspect ratio. Similarly, I think the issues of how borders and padding interact with sizing should be separate (and can _probably_ be just called browser bugs. A nasty infestation of large quantities of browser bugs). So, on the subject of this issue: There are three auto-size behaviors seen in the tests: - Scalable contents in a shrink-wrapped container shrink away to nothing. **I'm going to strongly argue that this is not a good default behavior, ever.** It could _maybe_ make sense for `min-content-size`, I guess. But it shouldn't be `auto` behavior. It is especially nonsensical in that Chrome and Safari _only_ apply this behavior to elements with an intrinsic aspect ratio; elements with no dimensions at all are saved by the default object size. Images with 100% inline-size (like @FremyCompany's initial fiddle) also get the default size in the inline direction in those browsers. - When there are scalable contents in a shrink-wrapped container, the container switches to extrinsic sizing, taking up its full block width (stretch fit), and then the contents fit to their container. **This is sub-optimal, but better; I would be OK with this approach.** This is somewhat like the Firefox behavior, but minus the Firefox bugs. Presumably you would do this recursively until you hit a container that did have a definite size (and/or, the viewport). So there could be performance impacts, especially because you might trigger a scroll bar that then changes the stretch-fit width and forces a recalc. - Scalable contents in a shrink-wrapped container are given the default object size. If they have an intrinsic aspect ratio, they get the default size in the inline direction and then have the block direction determined by aspect ratio. **Not ideal, but I think the best of the lot.** This is mostly the MS Edge behavior (minus the bugs related to borders and such). Yes, it's arbitrary, but it's consistent. It provides a reasonable size for floated and inline-block elements, and it provides consistent basis sizes for flexbox, grid, and tables. You get to see _something_ on screen, from which you can realize "oh, I should probably specify a size on that element". -- GitHub Notification of comment by AmeliaBR Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/951#issuecomment-319280918 using your GitHub account
Received on Tuesday, 1 August 2017 06:31:59 UTC