CSS padding-inline-start property


It is a logical property that defines space at the start side of a inline. The selection of start side depends on the writing-mode.

  • It behaves like padding-left for the horizontal-tb writing mode.

  • It behaves like padding-bottom or padding-top for the vertical-rl and vertical-lr writing-mode respectively.

Change the direction of flow of text.

horizontal-tb vertical-lr vertical-rl


padding-inline-start : length

Property values

0 lengthDefault

There is no thickness of the padding area at the start side of the border box.

padding-inline-start: 0;

+ve length

+ve value represents padding area at the start side of a block.

padding-inline-start: 20px;

-ve length

The space decreases by 20px at the start of inline i.e the the subsequent content may merge into the element.

padding-inline-start: -20px;

Applicable to

It applies to all elements

#CSS digger
Was this article helpful?

Check the behavior of padding-inline-start for different values of writing mode.
content after the inline