Set the minimum width of an element.
Syntax
min-width: length | percentage | none | inherit ;
Length - The min width in px, pt or em.
percentage - The min width as a percentage value
none - No limit on the width. (default)
inherit - inherit from the parent element.
max-content - Experimental/CSS 3, the intrinsic preferred width.
min-content - Experimental/CSS 3, the intrinsic minimum width.
fit-content - Experimental/CSS 3, the intrinsic preferred width.
fill-available - Experimental /CSS 3, The containing block width minus horizontal margin, border and padding.
available - An ancient name for the keyword above (some browsers only)
If the browser width is smaller than Min-width, then users will have to use the horizontal scroll to see all of the item.
Examples:
h1 { min-width: 250px; }
.emw3class { min-width: 25em; }
#emw3id { min-width: 400pt; }
Try it:
This is a sample of text with a CSS border. The border helps to display the width of the element |
(CSS 2) Browser Support: All major browsers.
“Somebody should tell us, right at the start of our lives, that we are dying. Then we might live life to the limit, every minute of every day. Do it! I say. Whatever you want to do, do it now! There are only so many tomorrows” ~ Pope Paul VI
Related:
width - Width of an element.
max-width - Maximum width of an element.
height - Height of an element.
box-sizing - The CSS box model used to calculate the height and width of elements.