HTML size Attribute

The size attribute on an <input> element defines the character width of the element. On a <select> element it defines the number of items that are visible.

Example

#

A size attribute on an <input> element.
The textbox is 25 characters wide, i.e. 25 characters are visible.


<label for="firstname">First name</label><br/>
<input type="text" size="25" 
       name="firstname" value="Josephine" >

For additional details see our HTML input size Reference.


Using size

On a <select> tag, the size attribute defines the number of visible options.

On an <input> tag, the size attribute defines the element's width in terms of number of characters.

This size attribute only applies to these input types:


Syntax

<tagname size="number">

Values

#

Value Description
number For an input element, the element's width in number of characters.
For a select element, the number of visible options.

Elements that accept size

These elements accept the size attribute.

Elements Description
<input> Specifies an input field -- see example above
<select> Creates a dropdown control.

<select> with size

A <select> tag with a size value of 4.
The control appears as a scrollable list with 4 options that are visible.


<form action="/tutorial/action.html">
  <label for="color">Select a color</label>
  <select name="color" id="color" size="4">
    <option value="red">Red</option>
    <option value="green">Green</option>
    <option value="blue">Blue</option>
    <option value="orange">Orange</option>
    <option value="purple">Purple</option>
    <option value="yellow">Yellow</option>
    <option value="brown">Brown</option>
    <option value="black">Black</option>
  </select><br />

  <button type="submit">Submit</button>
</form>

For additional details see our HTML select size Reference.


Browser support

Here is when size support started for each browser:

Chrome
1.0 Sep 2008
Firefox
1.0 Sep 2002
IE/Edge
1.0 Aug 1995
Opera
1.0 Jan 2006
Safari
1.0 Jan 2003

You may also like



Guides