CSS min-block-size Property

❮ Previous Reference Next ❯


p {
  background-color: #1A73E8;
  min-block-size: 500px;


Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum is simply dummy text of the printing and typesetting industry.


The min-block-size CSS property defines the minimum horizontal or vertical size of an element's block, depending on its writing mode. It corresponds to either the min-width or the min-height property, depending on the value of writing-mode.

If the writing mode is vertically oriented, the value of min-block-size relates to the minimum width of the element; otherwise, it relates to the minimum height of the element. A related property is min-inline-size, which defines the other dimension of the element.

Default value:none
JavaScript syntax:

Standard Syntax

min-block-size: none|length|percentage|max-content|min-content|fit-content(length|percentage)|initial|inherit|revert|revert-layer|unset;

Browser Support


Property Values

The following table describes the values of this property:

Value Description
none No limit on the size of the box.
length Defines the min-block-size as an absolute value.
percentage Defines the min-block-size as a percentage of the containing block's size in block axis.
max-content The intrinsic preferred min-block-size.
min-content The intrinsic maximum min-block-size.
fit-content(length|percentage) Uses the fit-content formula with the available space replaced by the specified argument, i.e. min(max-content, max(min-content, argument)).
initial Sets this property to its default value.
inherit If specified, the associated element takes the computed value of its parent element animation-delay property.
revert Reverts the cascaded value of the property from its current value to the value the property
revert-layer Rollback styles to the ones specified in previous cascade layers.
unset Resets a property to its inherited value if the property naturally inherits from its parent, and to its initial value if not.

Default CSS Property Values

selectors {
  min-block-size: none;
❮ Previous Reference Next ❯