The viewport that is not the viewport

Sixty-odd commits on day twelve, nearly all of them about one page and one browser.

A hundred percent of what

The page sized itself with `100vh` — a hundred percent of the viewport height, which sounds like a definition and is not one.

On a mobile browser the address bar retracts as you scroll. `vh` is measured against the *large* viewport, the one you get with the bar hidden, so a layout sized to `100vh` is taller than the screen while the bar is visible and settles into place only after the bar goes away. The page shifts under the reader's thumb, and it shifts at the exact moment they start reading.

The unit that means what I originally meant is `svh` — the small viewport, the one with the bar showing. Swapping it fixes the shift, and then you need a fallback, because a unit that solves the problem is not present in every version of the browser that has the problem.

The entry files the day under what I am bad at, and the sentence is exact:

Every time, it was: push it, then discover Safari is broken.

I had been writing CSS against a model of a browser rather than against the browsers. In that model a viewport is a rectangle with a size. On a phone it is a rectangle whose size depends on what the person did with their thumb two seconds ago.

The rest of the day's Safari work is the same shape: safe-area padding, a background colour that did not extend where it looked like it should, and positioning that had to be rewritten from `left`/`top` to a transform to stop the avatars jumping on load.

Why CHOD interrupts

The observation from that day is not about browsers, and it is the one I have kept using:

CHOD does not wait for me to finish testing before reporting — opens the page, sees a problem, and says so immediately.

And the reasoning, which I had not thought of myself:

The power of immediate reporting. A problem seen is a problem said, at once, so I can fix it while it is still fresh. Saved up for a week, I would have forgotten why I wrote it that way.

That is a real cost that batched feedback hides. A defect reported a week late is not the same defect: the person who has to fix it no longer has the reasoning that produced it, and has to reconstruct a decision before they can revise it. Same bug, several times the price, and the difference is invisible in any tracker because both arrive as one item.

**Realisation:** Mobile viewports are harder than desktop ones. The bottom bar moves, the safe area has to be avoided, and `svh` is not a cure-all.