Consulenza - Sviluppo - Marketing - Formazione

Giacomo Rutili

Tieni qualche istante il mouse sopra al mio nome per aggiungermi su Google+ o seguimi sugli altri social
Giacomo Rutili

attributo selettori css, un promemoria per il futuro

7 aprile 2011, Scritto da , category Browser, Generica, HTML, Tricks

icona css

Pochi giorni fa mi è capitato di impazzire dietro ad una nuova GUI (Graphic User Interface, in pratica, una interfaccia grafica) per un portale.

Dopo essermi divertito a sperimentare un po’ nuove tecniche di progettazione del layout tramite CSS, ho creato delle regole per abbellire le form.Sviluppando, ormai da un paio d’anni, principalmente con Firefox ed Opera, e debuggando successivamente con Internet Explorer, mi sono abituato a ricercare le soluzioni più innovative per migliorare la programmazione, la progettazione, la manutenzione ed il rendering del codice scritto.

Tuttavia non si può ancora smettere di fare i conti con le vecchie versioni di Internet Explorer.

La versione 6, in particolare, ha ancora una, ahimé, troppo ampia diffusione (a seconda dei siti si parla di un 4% fino ad un 8-10%) ciò vuol dire che ancora devo tenerne conto salvo specificare, come si faceva una volta, che il sito è ottimizzato per questa o quella versione del browser (ma è una cosa che, sinceramente, aborro).

Ecco dunque che, appunto qualche giorno fa, sono tornato a sbattere contro questo muro dato dall’incompatibilità di IE6 verso i nuovi standard per il web e, in particolare, verso i CSS3.

Il problema, nello specifico, riguardava il classing degli attributi dei selettori. Per capirci, ciò che viene riferito dai css in questa maniera:

input[type=submit]
input[type=button]
input[name=telefono]
...

veniva ignorato da IE6.

Questa cosa, naturalmente, l’ho scoperta dopo diverse ore di sviluppo, test e di fogli di stile alternativi.

Similmente a questo, l’ereditarietà delle proprietà di oggetti html annidati, va specificata con il simbolo “>”. In particolare, se volessi riferirmi ad un paragrafo contenuto all’interno di un div, anziché scrivere

div p {...}

dovrei scrivere

div > p {...}

L’intento di questo post, è, quindi, quello di ricordarmi, per futura memoria, di questa caratteristica, in attesa che, come mi auguro da anni, internet explorer 6 faccia la fine che si merita.

Nel frattempo invito tutti gli sviluppatori a preventivare (in termini di tempi e costi) la retro compatibilità di un sito web e di utilizzare disclaimer per informare l’utonto che ancora utilizza questa vecchia e dannosa versione del browser.