- From: CSS Meeting Bot via GitHub <sysbot+gh@w3.org>
- Date: Wed, 29 Apr 2020 16:58:13 +0000
- To: public-css-archive@w3.org
The CSS Working Group just discussed `Mapping HTML’s IMG aspect-ratio behavior into CSS`, and agreed to the following: * `RESOLVED: Add an aspect-ratio option that supports fallback from intrinsic ratio` * ``RESOLVED: Use the `<aspect-ratio>||auto` syntax`` * `RESOLVED: An aspect ratio specified with the auto option always applies to the content-box.` <details><summary>The full IRC log of that discussion</summary> <AmeliaBR> Topic: Mapping HTML’s IMG aspect-ratio behavior into CSS<br> <astearns> github: https://github.com/w3c/csswg-drafts/issues/4951<br> <AmeliaBR> fantasai:<br> <AmeliaBR> fantasai: This is about the new behavior in the HTML spec about using the img attributes for height and width, and use that as the aspect ratio until the image loads.<br> <AmeliaBR> ... We'd like to map this to the aspect-ratio property, but that property currently overrides intrinsic aspect ratio, so wouldn't fall back once the image loads.<br> <AmeliaBR> ... Proposal is to add a new syntax that allows you set both auto and a numeric ratio, so that auto is used if element has an intrinsic ratio.<br> <AmeliaBR> ... There's more about sizing, but want to discuss that first.<br> <AmeliaBR> TabAtkins: That proposal, just allowing both parts together, sounds good for syntax.<br> <AmeliaBR> astearns: Any concerns about the concept separate from syntax.<br> <AmeliaBR> ??: Is it clear what it means for an intrinsic ratio to be available?<br> <AmeliaBR> TabAtkins: Once an image has loaded, it's available.<br> <astearns> s/??/smfr/<br> <AmeliaBR> astearns: I think we'd want to match HTML as much as possible.<br> <AmeliaBR> ??: Is it possible to define the aspect ratio directly by the attributes?<br> <AmeliaBR> fantasai: that's the idea<br> <astearns> s/??/cbiesinger/<br> <AmeliaBR> plinss: The width and height attri butes also affect the displayed size, don't they?<br> <AmeliaBR> fantasai: Yes, but that can be overridden in CSS.<br> <AmeliaBR> ... but the aspect ratio can help it set the correct layout box while also having one dimension responsive.<br> <AmeliaBR> florian: Both the width/height and the aspect ratio would be based on HTML attributes, but independently, so one could be overridden but not the other.<br> <AmeliaBR> q+<br> <astearns> zakim, open queue<br> <Zakim> ok, astearns, the speaker queue is open<br> <AmeliaBR> fantasai: So this issue is about matching the HTML behavior.<br> <dbaron> I wonder why we don't also map the width and height attributes to the intrinsic width and intrinsic height for not-yet-loaded images.<br> <florian> +1, +1<br> <AmeliaBR> My question was how does this affect things other than img?<br> <AmeliaBR> E.g., SVG?<br> <fremy> (+1 too fwiw)<br> <AmeliaBR> fantasai: It should affect anything that provides an intrinsic aspect ratio, that becomes the auto, other is fallback<br> <AmeliaBR> So, this could be a way to give a fallback for images with no intrinsic aspect ratio, too.<br> <AmeliaBR> fantasai: yes.<br> <AmeliaBR> astearns: I see lots of enthusiasm, any objections?<br> <AmeliaBR> RESOLVED: Add an aspect-ratio option that supports fallback from intrinsic ratio<br> <AmeliaBR> astearns: any concerns on syntax?<br> <AmeliaBR> RESOLVED: Use the `<aspect-ratio>||auto` syntax<br> <AmeliaBR> fantasai: The other aspect of this is box sizing.<br> <r12a> s/atsushi: Calling from i18n wg/atsushi: Calling from i18n wg & jlreq<br> <AmeliaBR> … We've defined that box-sizing affects the aspect ratio calculation (is it aspect of border box or content box)<br> <AmeliaBR> ... But for intrinsic aspect ratios, that only affects the content box. If it applied to border box, the results wouldn't work out.<br> <AmeliaBR> ... With this new syntax, if you're using image width & height attributes, you always want that to affect content box<br> <AmeliaBR> ... Some options: If you use the auto keyword with a ratio, it always applies to the content box.<br> <tantek> I'm wondering if that assertion (you don't want to include the border in the aspect ratio) is true for form-control like things, whether actual replaced form control elements, or images being made to look like form controls.<br> <tantek> I don't have an answer, just wanting to raise the question for consideration<br> <AmeliaBR> ... Or, take a keyword to determine which box applies.<br> <AmeliaBR> dbaron: Doesn't this also affect width and height of image from the elements?<br> <AmeliaBR> fantasai: Yes, I think so. But maybe less of an issue in a modern responsive layout where you're also using box-sizing.<br> <AmeliaBR> ... I can't see a reason you'd want intrinsic sizes to affect the border-box. But I can imagine wanting an explict ratio to affect border-box. So auto could always be intrinsic & keyword could only affect ratio.<br> <AmeliaBR> florian: What about just always having box-sizing be used for explicit?<br> <AmeliaBR> fantasai: Because that wouldn't work for mapping attributes to an explicit ratio.<br> <fantasai> 1. aspect-ratio: <ratio><br> <AmeliaBR> astearns: We could always have good defaults for now with option of adding keyword later.<br> <fantasai> 2. aspect-ratio: auto<br> <AmeliaBR> fantasai: We have three options (typing)<br> <fantasai> 3. aspect-ratio: auto <ratio><br> <astearns> s/good defaults/defaults for html/<br> <AmeliaBR> fantasai: in case of explicit ratio only, there's a good argument for matching box-sizing. For auto, needs to match content-box always. For third case (fallback), that's the issue. Should explicit ratio apply to content box, despite normal behavior, because of auto. Or we can match box-sizing, but have a syntax for switching to content-box.<br> <fantasai> 4. aspect-ratio: auto <ratio> content-box<br> <AmeliaBR> fantasai: So that would look like option 4<br> <fantasai> Behavior of 4 is required to map IMG. Whether it's equivalent to 3 is the question<br> <AmeliaBR> fremy: I can't see any case where you'd want to use auto and not want the content-box. So I think it's solved by saying the auto keyword means content-box<br> <AmeliaBR> cbiesinger: Could you clarify? How does the box affect the calculation?<br> <AmeliaBR> fantasai: The box size should be the one that matches the aspect ratio.<br> <AmeliaBR> astearns: So the mood is that the new syntax, with auto, always uses the content box. Any objections?<br> <AmeliaBR> RESOLVED: An aspect ratio specified with the auto option always applies to the content-box.<br> <AmeliaBR> astearns: We can decide later if a keyword is necessary.<br> <tantek> I ok with prototyping it that way and quickly seeking feedback on how it interacts with box-sizing of other things in the layout<br> </details> -- GitHub Notification of comment by css-meeting-bot Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4951#issuecomment-621337849 using your GitHub account
Received on Wednesday, 29 April 2020 16:58:15 UTC