CSS - min-width


Advertisements


Description

The min-width property is used to set an lower bound on the width of an element.

Possible Values

  • length − Any length unit. The element can never have a value for width which is less than this distance.

  • percentage − Limits the element's width to be at least this percentage of the width of the containing block.

Applies to

All the HTML elements except non-replaced inline elements and table elements.

DOM Syntax

object.style.minWidth = "50px"

Example

Here is the example:

<html>
   <head>
   </head>
   <body>
      <p style="min-width:400px; height:100px; border:1px solid red; padding:5px; margin:10px;">
      This paragraph is 100px high and min width is 400px
      This paragraph is 100px high and min width is 400px
      This paragraph is 100px high and min width is 400px
      This paragraph is 100px high and min width is 400px
      This paragraph is 100px high and min width is 400px
      </p>
      
      <img alt="logo" src="/css/images/logo.png" width="95" height="84" />
   </body>
</html> 

This will produce following result −



Advertisements