Canmove, confirm
2,679
edits
Changes
→Styling HTML5 UI elements: theoretical use of ::choices, noted ::repeat-item & ::repeat-index are at-risk likely to be dropped, noted web designer request select arrow restylability
2. You must be able to use CSS to style the element, especially the UI that we generate. This includes any pre-defined pseudo-selectors (invalid, required, icon, etc.)
Whenever there is ''any'' custom appearance of a form control, e.g. based on the new types, designers ''must'' be able to restyle them to fit in with their design. This means at a minimum:
** consider existing [http://www.w3.org/TR/css3-ui/#pseudo-elements CSS3-UI pseudo-elements]
*** ::value can be used for selecting/styling placeholder text (see [https://bugzilla.mozilla.org/show_bug.cgi?id=457801#c25 bug 457801 comment 25])
*** ::choices can theoretically be used to style the popped-up state of a <code><select></code> pop-up menu. No known implementations.*** ::repeat-item - no known applicability to HTML(5) form controls, at-risk in CSS3-UI, likely to be dropped.*** ::repeat-index- no known applicability to HTML(5) form controls, at-risk in CSS3-UI, likely to be dropped.
** consider additional pseudo-elements based on vendor prefixed pseudos
*** Safari 5 supports pseudo-elements for restyling overflow scrollbars
**** ::webkit-scrollbar-track
**** ::webkit-scrollbar
** consider additional pseudo-elements based on web designer requests for stylability of form controls
*** <code>[[HTML5/select|<select>]]</code>
**** [http://stackoverflow.com/questions/611482/change-color-and-appearance-of-drop-down-arrow color and appearance of drop down arrow]
*** <code>[[HTML5/input#type_search|<input type=search>]]</code>
**** see examples from Jonas Sicking
* ability to select specific "states" of any form control (may require ability to select states of specific pieces as well - that will be a challenge though as pseudo-elements themselves cannot have pseudo-classes in CSS)
** existing [http://www.w3.org/TR/css3-selectors/#UIstates Selectors UI pseudo-classes], and some notes on [http://www.w3.org/TR/html5/interactive-elements.html#pseudo-classes how HTML5 DOM property states trigger these pseudo-classes]
