Re: Styling composite elements

On Wed, Feb 20, 2013 at 1:50 PM, Tab Atkins Jr. <jackalmage@gmail.com> wrote:
> On Wed, Feb 20, 2013 at 1:46 PM, Antony Kennedy <antony@silversquid.com> wrote:

>> If the standardised version of the select box had specific elements and behaviours, all written down in a specification then authors could predict those behaviours, and the pseudo-elements Henrick described would be predictably available. If the standardised version were enabled via CSS, then that is a lot less difficult to cope with? If it weren't enabled, the browser could do whatever it wanted.
>
> Have you seen what <select> elements do on mobile browsers, like
> Chrome on Android or the iOS browser?  It would be a terrible
> experience for the user if you could opt into a "normal" <select>.
>

It is true that different platforms render input elements differently.
But it is also true that all platforms are tend to represent them in
principle the same manner.
All UI platforms that are worth mentioning in this discussion have for
example <select> structured this way:
<select type=dropdown-list>
   <shadow:caption>text</shadow:caption>
   <shadow:button></shadow:button>
   <shadow:popup-list>
       <option>...</option>
       <option>...</option>
       ...
   </shadow:popup-list>
</select>

So we can expose this structure at least in form of pseudo-elements:

select::caption {....}
select::button {....}

-or something more generic/universal -

select {  style-set: my-select;  }

@set my-select {
   caption {...}
   button {...}
   ...
}

It is up to the platform to use these hints or not but they should be there.

This applies to all input elements. There are not that many of them actually.

-- 
Andrew Fedoniouk.

http://terrainformatica.com

Received on Wednesday, 20 February 2013 22:58:34 UTC