-1

In this talk auto value in CSS is explained in various contexts.Speaker said % is extrinsic unit which make sense because size is dependent on parent. but she also put em, vw, vh, rem and other relative unit's in fixed bucket. size calculation of vh and vw unit's is also dependent on external source(viewport) but why these values are not extrinsic.

user2022
  • 13
  • 6
  • it seems to didn't watch the video carefully. There is fixed sizes (relative and absolute) then extrinsic size that depend on **containing block** size. What is not clear? vw, vh, em doesn't depend on the containing block size – Temani Afif Mar 26 '22 at 10:18
  • vw, vh, em doesn't depend on the containing block size that's true and they depend on fixed sizes like font-size. but this is also true for percentage whom applied fixed size parent's child – user2022 Mar 26 '22 at 10:55
  • font-size is a thing, containing block is another thing. You are giving your own interpretation of what was not said in the video. The definition was made around the **containing block size** as simple as that. – Temani Afif Mar 26 '22 at 11:05
  • you are right percentage definition is around the containing block size but i am talking about Extrinsic sizing definition which says:- "Extrinsic sizing determines sizes based on the context of an element, without regard for its contents." it exclude only content of box but include context if context only limited to containing block size then why spec used word context instead of containing block size – user2022 Mar 26 '22 at 11:55

1 Answers1

0

It's because it is defined like this in CSS specification: https://www.w3.org/TR/css-sizing-3/#extrinsic

  1. Extrinsic Size Determination

Extrinsic sizing determines sizes based on the context of an element, without regard for its contents.

4.1. Percentage Sizing

Percentages specify sizing of a box with respect to the box’s containing block.

Jakub Kotrs
  • 5,823
  • 1
  • 14
  • 30
  • i already read it but i want to know logic behind to keep vh,em etc out of the extrinsic bucket – user2022 Mar 26 '22 at 10:08
  • If you use `vw` you don't need the the parent element to calculate it, it's intrinsic to the element using `vw`. It's a relative unit for sure and not an absolute, but it's still all defined on that one element. – Jakub Kotrs Mar 26 '22 at 10:10
  • according to spec:"Extrinsic sizing determines sizes based on the context of an element, without regard for its contents." how this is not true for vw – user2022 Mar 26 '22 at 10:17
  • The people with decision making power most likely agreed on the fact that viewport is not the context of the element in this sense, as it is not an element in CSS. – Jakub Kotrs Mar 26 '22 at 10:21
  • in vw calculation there is no need of parent but it still use viewport as grand or great ... grand parent based on its location in doc structure. – user2022 Mar 26 '22 at 10:21
  • if we forget about viewport units then what about em this is dependent on parent as percentage – user2022 Mar 26 '22 at 10:24
  • `em` does not depend on the parent, it's relative to the font-size of the element itself – Jakub Kotrs Mar 26 '22 at 10:25
  • viewport and font based(e.g. em) units are depend on fixed size e.g. font-size: 16px; but sometime percentage is also set on container whom parent size also fixed then why percentage is not fixed size – user2022 Mar 26 '22 at 14:57