CSS min-inline-size Property
Example
p {
background-color: #1A73E8;
min-inline-size: 500px;
}writing-mode:
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Meaning:
The min-inline-size CSS property defines the horizontal or vertical minimal 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-inline-size relates to the minimum height of the element; otherwise, it relates to the minimum width of the element. A related property is min-block-size, which defines the other dimension of the element.
| Default value: | none |
| Inherited: | No |
| Animatable: | Yes |
| Version: | CSS3 |
| JavaScript syntax: | |
Standard Syntax
min-inline-size: none|length|percentage|max-content|min-content|fit-content(length|percentage)|initial|inherit|revert|revert-layer|unset;Browser Support
Status
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-inline-size as an absolute value. |
| percentage | Defines the min-inline-size as a percentage of the containing block's size in block axis. |
| max-content | The intrinsic preferred min-inline-size. |
| min-content | The intrinsic maximum min-inline-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-inline-size: none;
}