Dofactory.com
Dofactory.com

HTML <input> type="month"

The <input> tag with a type="month" attribute creates a text field that accepts a month and year value.

Inside this field is a calendar icon. Clicking the icon opens a month/year picker.

Example

#

An <input> element of type month.
Clicking the calendar icon opens a month/year picker. Alternatively, enter the month and year directly into the field.

Birth month/year

<form action="/tutorial/action.html">
  <fieldset>
    <legend>Birth month/year</legend>

    <input type="month" name="birthmonth"><br /><br />

    <input type="submit" value="Submit">
  </fieldset>
</form>

Using input type="month"

The <input type="month"> specifies a month and year picker.

Clicking the calendar icon opens the month/year picker.

The UI of this control varies from browser to browser. In addition, browser support is spotty.

The month field also accepts manual entry which follows a month/year format.


Syntax

<input type="month">

Browser support

Here is when type="month" support started for each browser:

Chrome
25.0 Feb 2013
Firefox
Not Supported
IE/Edge
12.0 Jul 2015
Opera
10.1 Jun 2009
Safari
Not Supported

You may also like

 Back to <input>

Author: Jack Poorte
Published: Jun 20 2021
Last Reviewed: Sep 30 2023


What's your favorite/least favorite part of Dofactory?


Guides