IE8 e il prefisso CSS -ms-

Venerdì 12 Settembre 2008 - 08:22

di Cesare Lamanna

CSS

Chiariamo subito cosa si intende qui per prefisso CSS. Quando i produttori di browser introducono il supporto per proprietà/estensioni CSS proprietarie o comunque comprese in specifiche W3C che non abbiano raggiunto uno stato avanzato come Last Call o Candidate Recommendation, tali proprietà vengono fatte precedere da un prefisso specifico per ciascun browser. Per esempio, le trasformazioni CSS introdotte su WebKit vengono così definite in un CSS:

-webkit-transform: translate(3em,0);

E ancora, quando sull’ultimo Firefox è stato introdotto il supporto per la proprietà CSS3 box-shadow, la sintassi adottata è stata la seguente:

-moz-box-shadow: 10px 10px 5px #888, 10px 10px 30px rgba(0,0,0,0.4);

dove -moz- è il prefisso specifico di Mozilla Firefox.

Come specificato in questo post apparso su IEBlog, a Microsoft hanno pensato di adeguarsi alla tendenza in nome di una maggiore aderenza agli standard e alle buone pratiche ad essi associate.

L’interevento comprende una tabella che elenca tutte le proprietà/estensioni CSS che in IE8 (in modalità Standard) dovranno essere precedute dal prefisso -ms- per essere rese come desiderato. Si tratta per lo più (correggetemi se sbaglio) di proprietà molto di nicchia, tranne forse una: filter. Proprio ad essa, infatti, si può ricorrere per ottenere sul browser di Microsoft gli effetti di trasparenza che altrove si ottengono con opacity.

In pratica, si passa da

filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80, FinishOpacity=70, Style=2);

a

-ms-filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80, FinishOpacity=70, Style=2);

Per far sì che tutti gli utenti, quelli di IE8 e quelli delle versioni precedenti, continuino a fruire le pagine nel modo corretto si procederà, come da esempio allegato, in questo modo:

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";
       filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=50);
       opacity: .5;

usando anche opacity per gli altri browser.

Tags:

Categoria: CSS | Permalink

Commenti

1

Ma mettersi d’accordo per eliminare i prefissi e andare verso la “standardizzazione” no, eh?

# - postato da Gio - 12 Settembre 2008 - 09:10

2

semplicemente meglio non usare ancora quelle proprietà che non sono implementate da tutti i browser, alla faccia degli odiosi prefissi proprietari e della guerra tra browser.

# - postato da filippo - 12 Settembre 2008 - 09:23

3

Assolutamente d’accordo con Gio.
che soluzione idiota quella di introdurre i prefissi e fare coma ca. gli pare.

# - postato da Giacomo - 12 Settembre 2008 - 12:12

4

Mi sembra stupido mettere un prefisso dopo che questa proprieta’ ormai era presente dalla versione 5 se non erro. Non capisco perche’ non hanno lasciato il mondo come stava, adesso se si vorra’ utilizzare, invece di 2 righe di codice CSS bisognera’ scriverne 3 :-|
Una per IE 5/6/7, una per IE 8 e un’altra per tutti gli altri.
Grazie microsoft.

# - postato da Alessio Michelini - 12 Settembre 2008 - 13:56

5

nessun prefisso -> CSS validato

# - postato da simone - 15 Settembre 2008 - 11:16

6

No, mi sa che non è stato inteso il pensierio della MS fino in fondo:
Ci sono molti pisquani, che si considerano Web Designer, che ritengono l’unico Browser esistente l’ultimo che la MS ha messo in produzione. Questi utilizzano il “validissimo” strumento marcato MS per la creazione di “Professionali” siti (FrontPage :-( ) e considerano tutto quello che lui non supporta come superfluo e da non considerare.
Capite, quindi, che praticamente ogni altro browser si ritrova a visualizzare i siti creati con ’ste chiavica in maniera errata, spingendo gli utenti ad usare gli strumenti MS.
L’oggetto della discussione è solo l’ennesimo tentativo di rendere lo “Standard” MS innavicinabile agli altri browser, cosicché quelli che nulla capiscono di Web Design utilizzino solo lo standard che gli viene messo sotto il naso.
Francamente, vedo questa cosa ogni giorno ed il bello è che la gente la considera giusta!

# - postato da Daniele - 19 Settembre 2008 - 10:29

Inserisci il tuo commento:





(puoi usare i seguenti tag HTML per formattare il testo -
a href, b, i, br/, p, strong, em, ul, ol, li, blockquote, pre):

 

Anteprima del commento