max-width: ***; min-width: ***;

Browser
  • IE
  • Cr
  • Sf
  • Fx
  • O

The max-width property specifies the maximum width of an element, and the min-width property specifies the minimum width of an element.

The maximum width and minimum width of the form fields can be specified by applying these properties to the INPUT, TEXTAREA, and SELECT elements.


#example {
max-width: 500px;
min-width: 400px;
}
Property Value Explanation
max-width length, %, or none the size of the maximum width (the default is none)
min-width length or % the size of the minimum width

Example


<html>
<head>
<title>TAG index</title>

<style type="text/css">

.example {
width: 100%;
max-width: 600px;
min-width: 500px;
}

textarea {
height: 10em;
}

</style>

</head>
<body>

<p>minimum width:500px - maximum width:600px</p>

<form method="POST" action="example.cgi">

<p><input type="text" name="item1" class="example"></p>

<p><select name="item2" class="example">
<option value="select1">Select1</option>
<option value="select2">Select2</option>
<option value="select3">Select3</option>
</select></p>

<p><textarea name="item3" cols="50" rows="10" class="example"></textarea></p>

</form>

</body>
</html>
Output
Example pagenew window