/    /  CSS min-width

CSS min-width

 

This CSS property defines the minimum width of the content area of an element. Min-width does not include padding, borders, or margins.

 

Syntax:

 

min-width:       length | percentage | initial | inherit

 

Property Values:

 

  • none: Does not limit the width of the content box.
  • length: The length of min-width in px, cm, pt, etc.
  • initial: The property to its default value.
  • inherit: The property from its parent element.

 

Example:

 

<!DOCTYPE html>
<html>
<head>
<title>
min-width property
</title>

<style>
p{
border: 4px solid red;
background-color: gray;
display: inline-block;
color:white;
}
#px {
min-width: 425px;
}
#em {
min-width: 22em;
}
#pt {
min-width: 220pt;
}
#cm {
min-width: initial;
}
</style>
</head>
<body>
<h3> min-width: 425px; </h3>
<p id = "px">
Hi, Welcome to the I2Tutorials.
</p>
<h3> min-width: 22em; </h3>
<p id = "em">
Hi, Welcome to the I2Tutorials.
</p>
<h3> min-width: 220pt; </h3>
<p id = "pt">
Hi, Welcome to the I2Tutorials.
</p>
<h3> min-width: initial; </h3>
<p id = "cm">
Hi, Welcome to the I2Tutorials.
</p>
</body>
</html>

 

OUTPUT:

 

CSS min-width