Search Support

Avoid support scams. We will never ask you to call or text a phone number or share personal information. Please report suspicious activity using the “Report Abuse” option.

Learn More

input[type="time"] styling not working in Firefox 57 (for example ::-webkit-clear-button)

more options

After updating to Firefox 57 stopped working font and any pseudo elements css styling in input[type="time"]

Fiddle: https://jsfiddle.net/han4tt3p/

Similar stackoverflow question: https://stackoverflow.com/questions/47367772/remove-the-x-clear-button-from-the-input-type-date-and-change-the-font-famil/47368330#47368330

After updating to Firefox 57 stopped working font and any pseudo elements css styling in input[type="time"] Fiddle: https://jsfiddle.net/han4tt3p/ Similar stackoverflow question: https://stackoverflow.com/questions/47367772/remove-the-x-clear-button-from-the-input-type-date-and-change-the-font-famil/47368330#47368330

Modified by nexidan

All Replies (6)

more options

up

Bug is really annoying

more options

As you can see you are not going to get a answer to your question. It will be moving to page 2 and will be gone. This is not the purpose of Firefox Volunteer Support to help you figure out how to hack specific parts of it. Find your information elsewhere.

Regards Firefox Volunteer Support

more options

This reminds me of posts made when some other HTML5 input types were introduced natively in Firefox and workarounds through jQuery or other libraries were preempted, breaking some desired functionality. If you do not like the native implementation, you could continue scripting around it.

more options

Pkshadow said

As you can see you are not going to get a answer to your question. It will be moving to page 2 and will be gone. This is not the purpose of Firefox Volunteer Support to help you figure out how to hack specific parts of it. Find your information elsewhere. Regards Firefox Volunteer Support

Created bug at bugzilla, it was a little bit hard to find proper place to submit a bug.

jscher2000 said

This reminds me of posts made when some other HTML5 input types were introduced natively in Firefox and workarounds through jQuery or other libraries were preempted, breaking some desired functionality. If you do not like the native implementation, you could continue scripting around it.

This bug just broke all compatibility with older versions of firefox. Besides, even font styling on input isn't working, so it's clearly bug. It's better not to answer on questions if you aren't familiar with such kind of things or just not properly checked.

more options

nexidan said

This bug just broke all compatibility with older versions of firefox. Besides, even font styling on input isn't working, so it's clearly bug.

In earlier versions of Firefox, the type="time" attribute was ignored and Firefox displayed the input as type="text". There was a dom.forms.datetime preference users could switch from false to true in about:config to use the current time control, but most likely neither you nor anyone else using your site was using a time control before.

I have attached comparison screenshots of

https://jsfiddle.net/vybhv3u5/1/

from Firefox 57 and Firefox 52 esr.

Font. The font face for type="time" appears locked to the user's default monospace font. It's hard to see why web authors should not be allowed to change this.

Clear Button. Neither version of Firefox recognized "::-webkit-clear-button" or any similar clear-button property. You can confirm this by searching in the source code:

Firefox 57 (current release): https://dxr.mozilla.org/mozilla-release/source/

Firefox 52 ESR: https://dxr.mozilla.org/mozilla-esr52/source/

Should web authors be able to hide the clear button? I can't see any way to clear a time control without that button. If you hide it, I'll need something like a Clear command on the right-click context menu to replace it.