CSS padding-block property


It is a logical property that defines space at the start and end sides of the content inside a box. The selection of start side depends on the writing-mode.

  • It behaves like padding-top and padding-bottom for the horizontal-tb writing mode.

  • It behaves like padding-right and padding-left for the vertical-* writing-mode respectively.

Change the direction of flow of text.

horizontal-tb vertical-lr vertical-rl


padding-block : padding-block-start    padding-block-end

Property values


Both the padding-block-start and padding-block-end are 20px.

padding-block: 20px;

20px 40px

The padding-block-start and padding-block-end values are 20px and 40px respectively.

padding-block: 20px 40px;

Applicable to

It applies to all elements

#CSS digger
Was this article helpful?

Check the behavior of padding-block-start for different values of writing mode.