CSS inline-size property


CSS inline-size property defines width or height for an element. The selection of height or width depends upon the writing-mode.

  • The inline-size behaves as width for the horizontal-tb writing-mode.

  • The inline-size behaves as height for the vertical-* writing-mode.

Change the direction of flow of text.

horizontal-tb vertical-lr vertical-rl


inline-size : auto | +ve length | +ve percentage

Property values


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

inline-size: auto;

+ve length

The inline-size of an element should be at least 300px.

inline-size: 300px;

+ve percentage

The size of an element should be 30% of the parent box.

inline-size: 30%;

Applicable to

It applies to all elements except non-replaced inline.

#CSS digger
Was this article helpful?

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