This website uses cookies

We use cookies to personalize content and ads, to provide social media features and to analyse our traffic. We also share information about your use of our site with our social media, advertising and analytics partners who may combine it with other information that you've provided to them or that they've collected from your use of their services. Please read more at our privacy policy page.



Min-width

CSS min-width property sets the minimum width of an element. By using this property, we prevent the width property's value from becoming smaller than the value specified for min-width.

Meanwhile, we must know that CSS min-width property overrides width property and CSS max-width property.

The property takes a CSS length (px, pt, em, and so on), or a percentage. Negative length values are illegal.

CSS Syntax

min-width: length | initial | inherit;

Let's see an example:

<!DOCTYPE html>
<html>
   <head>
      <style>
        div {
             min-width: 15%;
             background-color: orange;
         }
      </style>
   </head>
   <body>

        <div>We set the minimum width of this text as 15%.</div>

   </body>
</html>

Here the result is:



Property Values

Value Descriptions
length It defines minimum width in px, pt, cm, etc.
% It defines minimum width in percent of the containing element.
initial It makes the property use its default value.
inherit It inherits the property from its parents element.