Remove seconds in Chrome input=time Remove seconds in Chrome input=time google-chrome google-chrome

Remove seconds in Chrome input=time


I know this is a very old question, but I just found the solution.

You must change your step to 60. If you leave your step default (1), it will have to increase one second, so it must show seconds at the field.

If you set your step to 60, it will increase 1 minute at a time, so it doesn't need to show the seconds.


@hend's solution of setting step to 60 works on an empty input, but if you load your form with values prepopulated, you'll find that seconds may reappear in a disabled state.

enter image description here

You can mask them and the dangling colon with the following CSS:

  ::-webkit-datetime-edit-second-field {    background: $color-white;    color: transparent;    margin-left: -3px;    position: absolute;    width: 1px;  }

Which yields the following:

enter image description here


I could not find any change/release notes for 23.0.1271.64 m that relates to any changes of the form input types but according to the latest working draft of the HTML5 markup documentation by W3C the input type="time" element does not support any other time format than "a valid partial-time as defined in RFC 3339", and that is hh:mm:ss.ff and hh:mm:ss.

As there are no attribute to specify your own date/time format on neither one of the date/time input elements you are stuck with the defined format(s).

From input type=time – time input control

Value: A valid partial-time as defined in [RFC 3339].
Examples:
23:20:50.52
17:39:57

From RFC 3339

time-secfrac = "." 1*DIGIT
partial-time = time-hour ":" time-minute ":" time-second [time-secfrac]

Finally, I am including a screenshot of how Chrome 23.0.1271.64 m renders the different time formats (on my machine);

<input type="time" value="23:20:50.52" /><input type="time" value="17:39:57" /><input type="time" value="13:37" /><input type="time" value="" />

enter image description here

The markup is also available at jsFiddle.