CodePen Embed - Layout viewport vs initial containing block

<div class="viewport"></div>

html {
  width: 100%;
  height: 100%;
  outline: 10px solid hotpink;
  outline-offset: -10px;
}

.viewport {
  position: fixed;
  inset: 0;
  outline: 10px dashed green;
  outline-offset: -10px;
}

body {
  height: 200vh;
}

Run Pen

This Pen is owned by utilitybend on CodePen.

See more by @utilitybend on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.