Come risolvere il problema di Internet Explorer con i fogli di stile

Se sei arrivato a questo articolo, al 99% dei casi, è perché stai riscontrando problemi con la realizzazione di pagine web e la compatibilità con Internet Explorer… o no? Lo odio…
Ma comunque…
Diciamo che per venire in contro a questi problemi, è possibile utilizzare delle funzioni condizionali che ci permettono di selezionare diversi fogli di stile in base alla versione del browser che sta aprendo la pagina.
Queste istruzioni vanno inserite all’interno dei tag assieme al resto dei nostri per i file css.
Con la sintassi simile a quella di un commento html le funzioni condizionali si presentano cosi:

Per tutte le versioni di IE

<!--[if IE]>
	<link rel="stylesheet" type="text/css" href="csspertuttigli_ie.css" />
<![endif]-->

Tutti i browser tranne IE

<!--[if !IE]>
	<link rel="stylesheet" type="text/css" href="non-ie.css" />
 <!--<![endif]-->

Solo IE 7

<!--[if IE 7]>
	<link rel="stylesheet" type="text/css" href="ie7.css">
<![endif]-->

Solo IE 6

<!--[if IE 6]>
	<link rel="stylesheet" type="text/css" href="ie6.css" />
<![endif]-->

Solo IE 5

<!--[if IE 5]>
	<link rel="stylesheet" type="text/css" href="ie5.css" />
<![endif]-->

Solo IE 5.5

<!--[if IE 5.5000]>
<link rel="stylesheet" type="text/css" href="ie55.css" />
<![endif]-->

IE 6 e precedenti

<!--[if lt IE 7]>
	<link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->
<!--[if lte IE 6]>
	<link rel="stylesheet" type="text/css" href="ie6-and-down.css" />
<![endif]-->

IE 7 e precedenti

<!--[if lt IE 8]>
	<link rel="stylesheet" type="text/css" href="ie7-and-down.css" />
<![endif]-->
<!--[if lte IE 7]>
	<link rel="stylesheet" type="text/css" href="ie7-and-down.css" />
<![endif]-->

IE 8 e precedenti

<!--[if lt IE 9]>
	<link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->
<!--[if lte IE 8]>
	<link rel="stylesheet" type="text/css" href="ie8-and-down.css" />
<![endif]-->

IE 6 e superiori

<!--[if gt IE 5.5]>
	<link rel="stylesheet" type="text/css" href="ie6-and-up.css" />
<![endif]-->
<!--[if gte IE 6]>
	<link rel="stylesheet" type="text/css" href="ie6-and-up.css" />
<![endif]-->

IE 7 e superiori

<!--[if gt IE 6]>
	<link rel="stylesheet" type="text/css" href="ie7-and-up.css" />
<![endif]-->
<!--[if gte IE 7]>
	<link rel="stylesheet" type="text/css" href="ie7-and-up.css" />
<![endif]-->

IE 8 e superiori

<!--[if gt IE 7]>
	<link rel="stylesheet" type="text/css" href="ie8-and-up.css" />
<![endif]-->
<!--[if gte IE 8]>
	<link rel="stylesheet" type="text/css" href="ie8-and-up.css" />
<![endif]-->

Diciamo che il problema non lo si risolve, ma lo si aggira… ma in fondo, che ci possiamo fare noi, se sti genii di sviluppatori non riescono a far pace con loro stessi…

Potrebbero interessarti anche...