search

w3c / csswg-drafts

CSS Working Group Editor Drafts
https://drafts.csswg.org/
Other
4.5k stars 661 forks source link

[css-values-4] Difference of viewport and initial containing block size #5218

Closed vwkd closed 11 months ago

vwkd commented 4 years ago

What is the difference between the size of the viewport and the size of the initial containing block (ICB)? The current spec is contradicting itself (at least for continuous media). There are two possibilities:

  1. Size is the same

Matches definition in 10.1 in CSS2.

For continuous media, [the ICB] has the dimensions of the viewport [..].

  1. Size is different

The size of the viewport is the visible part of the document without overlays (like scrollbar, on-screen keyboard), while the size of the ICB is with it.

Matches definition in note in css-values-4 on viewport-percentage lengths.

Note that the initial containing block’s size is affected by the presence of scrollbars on the viewport.

I guess it is the second? But no matter what the answer is, there is at least one bug in css-values-4.

If the answer is 1., then the note quoted in 2. is erroneous.

If the answer is 2., then the definition in 1. is erroneous (which is quoted through as still valid definition, e.g. in css-display). Additionally the definition of the viewport-percentage lengths is erroneous.

The viewport-percentage lengths are relative to the size of the initial containing block.

Yes, the spec includes the scrollbar afterwards

However, when the value of overflow on the root element is auto, any scroll bars are assumed not to exist.

But then, this is exactly the difference between the size of the viewport and the size of the ICB. So the spec should just use the correct term (viewport). Defining an exception for a term (ICB) that is used to differentiate from another term (viewport) but making the exception so the term equals the other term from which it tried to differentiate itself in the first place is ... confusing, to say the least.

CendioOssman commented 1 year ago

It's definitely some form of 2 in practice. (At least) Mobile browsers will create an ICB that is large enough to safely contain the largest visual viewport, which can be larger than the layout viewport.

It would probably be good to get some clarity on this, as it affects at least fixed position elements, as discussed in #8410.

tabatkins commented 11 months ago

The spec (along with the specs defining the appropriate concepts - Display and Position) is now well-defined. The ICB is the "small viewport size" and the fixpos containing block is the layout viewport which is the "dynamic viewport size".

Commits: 504724653630e57f934be6fe3f11d3cf3eaae0a0 and 79daa0a8f380ba62123d03b36a2dfa65465ef569

CendioOssman commented 11 months ago

That can't be right? The containing block of a fixed element is in some cases larger than any of the viewport dimensions.

tabatkins commented 11 months ago

Can you provide an example of one of those cases?

hiikezoe commented 11 months ago

I suppose this case is one of such cases what @CendioOssman is concerned; https://hiikezoe.github.io/vh-units.html

CendioOssman commented 11 months ago

It happens on mobile browsers when they are in their "desktop mode". I'll see if I can link to an example. The one @hiikezoe refers to might be relevant, but I don't have a device here to confirm it right now.