CSS block-size property


CSS block-size property is a logical property and represents height or width for an element. The selection of height or width depends upon the writing-mode.

  • The block-size represents height for the horizontal-tb writing-mode.

  • The block-size represents width for the vertical-* writing-mode.

Change the direction of flow of text.

horizontal-tb vertical-lr vertical-rl


block-size : auto | +ve length

Property values


auto value means the size will be changed automatically according to the content.

block-size: auto;

+ve length

It specifies the fixed size of a block.

block-size: 300px;

Applicable to

It applies to all elements except non-replaced inline.

#CSS digger
Was this article helpful?

We are learning block-size property for different values of writing-mode.