HTML max Attribute
Description
The max
attribute in HTML specifies the maximum value for an element. It is most commonly used with <input>
elements to define the upper limit of what numbers, dates, or times can be entered by the user. The applicability and behavior of the max
attribute can vary depending on the type of input it is associated with.
For <input>
elements of type number
, range
, date
, datetime-local
, month
, time
, and week
, the max
attribute determines the maximum acceptable value. Users will not be able to submit a form with a value in the input field that exceeds this maximum. For example, in an input field designed to accept a year, setting max="2023"
means users can only enter a year up to 2023.
It's important to note that while the max
attribute can restrict input on the client side, it should not be solely relied upon for validation. Server-side validation is also necessary to ensure data integrity, as client-side restrictions can potentially be bypassed.
In summary, the max
attribute serves as a constraint in form elements, ensuring that the values entered by users fall within a specified range. Its use enhances form usability and helps in the preliminary validation of user inputs.
Syntax
<input max="number | datetime">
Values
- numberThe maximum numeric value in an input field.
- datetimeThe maximum datetime value in an input field.
Applies To
The max
attribute can be used on the following html elements.
Example
<form action="formscript.php">
Enter a number between 1 and 10:<br>
<input type="number" id="quantity" name="quantity" min="1" max="10">
<br><br>
<button type="submit">Submit</button>
</form>
Browser Support
The following table will show you the current browser support for the HTML max
Attribute.
Desktop | |||||
12 | 4 | 16 | 12.1 | 5 |
Tablets / Mobile | |||||
18 | 16 | 12.1 | 4 | 1 | 37 |
Last updated by CSSPortal on: 26th March 2024