The size
attribute defines the width of the <input>
and the height of the <select>
element. For the input
, if the type
attribute is text or password then it's the number of characters. This must be an integer value 0 or higher. If no size
is specified, or an invalid value is specified, the input has no size declared, and the form control will be the default width based on the user agent. If CSS targets the element with properties impacting the width, CSS takes precedence.
The size
attribute has no impact on constraint validation.
Examples
By adding size
on some input types, the width of the input can be controlled. Adding size on a select changes the height, definining how many options are visible in the closed state.
<label for="fruit">Enter a fruit</label> <input type="text" size="15" id="fruit">
<label for="vegetable">Enter a vegetable</label> <input type="text" id="vegetable">
<select name="fruits" size="5">
<option>banana</option>
<option>cherry</option>
<option>strawberry</option>
<option>durian</option>
<option>blueberry</option>
</select>
<select name="vegetables" size="5">
<option>carrot</option>
<option>cucumber</option>
<option>cauliflower</option>
<option>celery</option>
<option>collard greens</option>
</select>
Specifications
Specification | Status |
---|---|
HTML Living StandardThe definition of 'size attribute' in that specification. | Living Standard |
HTML 5.1The definition of 'size attribute' in that specification. | Recommendation |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
No compatibility data found. Please contribute data for "html.elements.attribute.size" (depth: 1) to the MDN compatibility data repository.
See also
maxlength
minlength
pattern
HTML attribute: size by Mozilla Contributors is licensed under CC-BY-SA 2.5.