- From: Luke Warlow via GitHub <noreply@w3.org>
- Date: Tue, 27 Jan 2026 00:52:49 +0000
- To: public-css-archive@w3.org
lukewarlow has just created a new issue for https://github.com/w3c/csswg-drafts: == [css-forms-1] Specify behaviour of readonly and disabled temporal inputs == Related to but more nuanced than https://github.com/w3c/csswg-drafts/issues/12490 `data:text/html,<input type="date" value="1970-01-01"><br><input type="date" readonly value="1970-01-01"><br><input type="date" readonly value="1970-01-01" disabled>` Given the above HTML, each engine seems to do fairly different things. ## Chromium Chromium sets its `::-webkit-calendar-picker-indicator` to visibility hidden when the input is readonly or disabled. You can still focus the individual components of the readonly input. Click focuses the components too but doesn't trigger the picker. Interestingly you can still press space to load the picker and then change the *readonly* inputs value. Disabled inputs are completely unfocusable. Readonly inputs are rendered the same as read-write ones (except for the hidden icon). <img width="143" height="87" alt="Image" src="https://github.com/user-attachments/assets/111752a5-2e0e-419a-bc37-6faf53c49ff9" /> ## Firefox Firefox sets it's internal datetime-calenda-button to `display: none` when the input is readonly or disabled. You *cannot* focus the input at all (neither keyboard nor mouse). As a result there's no way to trigger the picker or edit the value of reaonly nor disabled inputs. Disabled inputs are also completely unfocusable. Readonly inputs have the same border style as read-write but the internal text is rendered like a disabled input (grey color). <img width="157" height="87" alt="Image" src="https://github.com/user-attachments/assets/f449a7db-32c1-418c-afea-47443c5960cf" /> ## Safari Safari doesn't have a calendar picker icon. Readonly input components also remain fully keyboard focusable (I have the "nicer" tabbing actually works setting enabled so not sure about standard mode). Click focuses the components too but doesn't trigger the picker. Interestingly you can *also* still press space to load the picker and then change the *readonly* inputs value. Disabled inputs are completely unfocusable. Readonly inputs are rendered identically to read-write inputs. <img width="102" height="96" alt="Image" src="https://github.com/user-attachments/assets/0f38f4d9-47a1-428e-b937-b617d01e5bc9" /> Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/13401 using your GitHub account -- Sent via github-notify-ml as configured in https://github.com/w3c/github-notify-ml-config
Received on Tuesday, 27 January 2026 00:52:49 UTC