max-block-size | CSS CSS Properties

A logical property that sets the maximum size of an element in the block axis (usually 'height'). It's the logical replacement for 'max-height'.

Quick example

.side-panel {
  /* Prevents the panel from growing taller than 80vh logically */
  max-block-size: 80vh;
  overflow: auto;
}

Initial value

none

Inherited

Applies to

same as width and height

Animation type

lpc

max-width

Widely available Since 2021 95% global usage

This feature is well established and works across many devices and browser versions. It has been available across browsers since 2021.

Safe to use without fallbacks.

57+

41+

12.1+

79+