| Class | Properties |
|---|---|
.min-w-0 | min-width: 0; |
.min-w-50 | min-width: 50%; |
.min-w-dropdown | min-width: $min-width-dropdown-menu; |
.min-w-full | min-width: 100%; |
.min-w-screen | min-width: 100vw; |
Usage
Use .min-w-{number} to apply a minimum width to an element.
Variants
By default, only responsive variants are generated for min width utilities.
Responsive
To control the minimum width of an element at a specific breakpoint, add a {screen}: prefix to any existing min width utility.
For example, use .md:min-w-50 to apply the min-w-50 utility at only medium screen sizes and above.
Hover-state
To include hover-state variants like .hover:min-w-50, add "min-width" to the $hover-variants variable when recompiling your CSS:
$hover-variants: (
// ...
"min-width",
);