Block Size

Utilities for controlling the block-size of an element.

Class CSS Output
block-auto
block-size: auto;
}
block-full
block-size: 100%;
}
block-screen
block-size: 100vh;
}
block-0
block-size: calc(var(--spacing) * 0);
}
block-4
block-size: calc(var(--spacing) * 4);
}
block-8
block-size: calc(var(--spacing) * 8);
}
block-1/2
block-size: calc(1/2 * 100%);
}
block-1/3
block-size: calc(1/3 * 100%);
}
block-[100px]
block-size: 100px;
}

block-auto

block-size: auto;

block-full

block-size: 100%;

block-screen

block-size: 100vh;

block-0

block-size: calc(var(--spacing) * 0);

block-4

block-size: calc(var(--spacing) * 4);

block-8

block-size: calc(var(--spacing) * 8);

block-1/2

block-size: calc(1/2 * 100%);

block-1/3

block-size: calc(1/3 * 100%);

block-[100px]

block-size: 100px;

Reference

block-size MDN ↗

CSS Properties

  • block-size