diff --git a/css-sizing-4/Overview.bs b/css-sizing-4/Overview.bs index d7135b202c33..877b1bc3710b 100644 --- a/css-sizing-4/Overview.bs +++ b/css-sizing-4/Overview.bs @@ -530,7 +530,7 @@ Overriding Contained Intrinsic Sizes: the 'contain-intrinsic-*' properties
Name: contain-intrinsic-width, contain-intrinsic-height, contain-intrinsic-block-size, contain-intrinsic-inline-size - Value: auto? [ none | <> ] + Value: [ auto | from-element ]? [ none | < > ] Initial: none Inherited: no Logical property group: contain-intrinsic-size @@ -554,25 +554,45 @@ Overriding Contained Intrinsic Sizes: the 'contain-intrinsic-*' properties usually ending up with a larger content size than specified. - : auto? [ none | <
If an element has an [=explicit intrinsic inner size=] in an axis, @@ -600,7 +620,7 @@ Overriding Contained Intrinsic Sizes: the 'contain-intrinsic-*' properties> ] + : none | < > + :: + If no other 'contain-intrinsic-size' value + (such as ''contain-intrinsic-size/auto'') + is providing an [=explicit intrinsic inner size=], + the corresponding axis either doesn't have an [=explicit intrinsic inner size=] + (if ''contain-intrinsic-size/none'' is specified) + or has an [=explicit intrinsic inner size=] of the specified <>. + + : auto :: If ''contain-intrinsic-size/auto'' is specified and the element has a [=last remembered size=] and is currently [=skipping its contents=], its [=explicit intrinsic inner size=] in the corresponding axis is the [=last remembered size=] in that axis. - + Note: This occurs, for example, when an element with ''content-visibility: auto'' is off-screen. - Otherwise, - the corresponding axis either doesn't have an [=explicit intrinsic inner size=] - (if ''contain-intrinsic-size/none'' is specified) - or has an [=explicit intrinsic inner size=] of the specified < >. - content-visibility/content-visibility-058.html + + : from-element + :: If ''contain-intrinsic-size/from-element'' is specified + and the element is a [=replaced element=] + with an [=internal layout intrinsic size=], + its [=explicit intrinsic inner size=] in the corresponding axis + is that size. + + Note: Whether a [=replaced element=] + has an [=internal layout intrinsic size=] + is defined by the [=host language=]. + In HTML, only <Name: contain-intrinsic-size - Value: [ auto? [ none | <'contain-intrinsic-size' is a shorthand property @@ -656,6 +676,67 @@ Last Remembered Size even across changes such as going to/from ''display: none''. +> ] ]{1,2} + Value: [ [ auto | from-element ]? [ none | < > ] ]{1,2} +Responsively-sized iframes
+ + Some [=replaced elements=] can contain "normal" flowed content, + such as HTML <{iframe}>s. + For privacy and security reasons, + these elements do not, by default, + expose any information about their internal contents' sizing + to the outside page, + instead just using a static, predetermined intrinsic size, + and making their contents scrollable. + The ''contain-intrinsic-size/from-element'' value of 'contain-intrinsic-size' + allows these elements to opt into exposing their actual content size, + known as their internal layout intrinsic size. + + Which elements have an [=internal layout intrinsic size=], + and how it's determined, + are decided by the host language. + In HTML, only <{iframe}> elements can have an [=internal layout intrinsic size=], + and further, + only when the contained document has also opted in + via a<meta name=responsize-embedded-sizing>element. + + An <{iframe}> initially doesn't have an [=internal layout intrinsic size=]. + When an <{iframe}>'s internal document is loaded, + if the required <{meta}> element is present + at the time of theDOMContentLoadedandloadevents, + the <{iframe}>'s [=internal layout intrinsic size=]'s height + is set to the [=natural height=] of the embedded document. + Subsequent changes to content, styling or layout of the embedded document + do not affect the [=internal layout intrinsic size=]. + ++ When the embedded document has the following HTML: + ++ + In addition, + the internal document can call {{window/requestResize()|window.requestResize()}}; + if the document still has the required <{meta}> element, + its [=internal layout intrinsic size=]'s height + is updated to its new current [=natural height=]. + + Note: If the required <{meta}> element is not present, + the call throws a {{NotAllowedError}} {{DOMException}} instead. ++ + + + + and the embedding document has the following CSS: + ++ iframe { + contain-intrinsic-block-size: from-element 150px; + } ++ + The height of the <{iframe}> will initially be ''150px'', + but will be updated to ''500px'' once the iframe's document loads. +Interaction With ''overflow: auto''