CSS min-block-size property

Property values

noneDefault

No limit of block-size is applied to an element.

min-block-size: none;

Try it { }

min-content

min-content value specifies that the minimum block-size of element must be equal to or greater than the largest minimum block-size of some descendant item.

min-block-size: min-content;

Try it { }

max-content

max-content value represents that the minimum block-size of element must be equal to or greater than the largest maximum block-size of some descendant item.

min-block-size: max-content;

Try it { }

+ve length

300

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

min-block-size: 300px;

Try it { }

+ve percentage

30

The block-size of element should be at least 30% of the parent box.

min-block-size: 30%;

Try it { }

auto

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

min-block-size: auto;

Try it { }