La solution la plus simple serait d’ utiliser les propriétés suivantes sur le conteneur pour simuler le comportement d’un tableau:
display:table-cell;vertical-align:middle;
Seulement cette solution ne fonctionne pas sous Internet Explorer 6…
Voici donc une autre solution qui fonctionne sous IE6: CSS :
#conteneur{height:400px;position:relative;}#bloc{position:absolute;top:50%;height:200px;margin-top:-100px;/* margin-top négatif de la moitié de la propriété height */}
Google vient de proposer un plugin ( open source ) pour Internet Explorer 6, 7, 8 qui permet de charger une page web avec le moteur de rendu de Chrome, si la page contient dans son code la balise <meta> suivante:
Ceci devrait donc permettre aux irréductibles d’internet explorer 6 d’ accéder enfin à un Web plus rapide et conforme aux normes du W3C avec en prime les nouvelles balises de l’ HTML 5 (<canvas>,<header>…), mais aussi de soulager les développeurs web de nombreuses heures de souffrances pour rendre le web « compatible IE6″…donc faites tourner l’info…
Dans la série IE6 voici 3 différentes manières de cibler IE6 dans votre code CSS:
Avec le !important :
La clause !important est comprise par tous les navigateurs sauf IE6 et elle permet de donner la priorité à une instruction même si elle est redéfinie par la suite. Dans l’exemple ci-dessous l’ objet d’identifiant « test » sera vert dans tous les navigateur et rouge sous IE6.
En semant IE6 avec des sélecteurs trop compliqués pour lui:
IE6 ne lira pas les sélecteurs trop compliqués comme « #test[id]« . Dans l’exemple ci-dessous l’ objet d’ identifiant « test » sera rouge dans tous les navigateur et vert sous IE6.
Avec les commentaires conditionnels :
Les commentaires conditionnels doivent être insérés dans votre code HTML et permettent ici de restreindre certaines instructions CSS à IE6.Dans l’exemple ci-dessous l’ objet d’ identifiant « test » sera rouge dans tous les navigateur et vert sous IE6.
Puisque nous allons nous « payer » IE6 jusqu’en 2014 (date de fin support de micro$oft..), j’ai décidé de faire une série de posts sur les bugs de IE6 en donnant la solution pour chacun d’eux. Celui-ci concerne z-index qui permet de gérer l’empilement (profondeur) des éléments HTML sur une page.
On rencontre ce bug la plupart du temps en créant un menu déroulant,quant le menu se déroule sous le contenu.
Pour le résoudre il suffit d’associer les styles CSS : position:relative; et : z-index:1; à la balise parente.
Depuis hier, le site de vidéo Youtube détenu par Google, affiche le message suivant aux utilisateurs de IE6 (Internet explorer 6):
Utilisez un navigateur plus récent pour bénéficier d’autres fonctionnalités en ligne. L’assistance relative à Internet Explorer 6 ne sera bientôt plus disponible, effectuez la mise à niveau dès que possible.
Et propose 3 navigateurs de substitution ( Google Chrome , Firefox 3.5 et Internet Explorer 8 ) .
Ceci est une très bonne nouvelle ! Merci Youtube! Mais à quand le même le message sur facebook ? Et la fermeture de Google aux utilisateurs de IE6?
Pour ma part je vais surement arrêter de passer du temps à « développer pour IE6″ et en passer plus à réaliser de belles choses
Pour ceux qui souhaitent participer à la lutte, voici un script très sympa à mettre sur votre site : ie6update.com.
Depuis plus d’une semaine, des sites norvégiens de grande audience comme finn.no, affichent clairement aux visiteurs de leurs sites qui utilisent le navigateur IE6 que la navigation sera bien plus confortable si ils changent de navigateur, et proposent des alternatives telles que Firefox, Opera,chrome…etc.
En effet ce navigateur sorti en 2001 par microsoft, ne respecte plus du tout les standards actuels du Web, et nous obligent(concepteurs de site web) à passer d’innombrables heures à corriger les bugs d’affichage de IE6…
Aujourd’hui le navigateur est encore utilisé par environ 20% des français, ce qui n’est pas encore assez négligeable pour laisser ces personnes se débrouiller avec leurs bugs d’affichage.
Aujourd’hui il est temps de forcer la main de ces 20% à changer de navigateur en agissant tous ensemble!
C’est pourquoi je vous propose une petite liste de site ou plugin qui vous permettront de mettre un avertissement aux visiteurs utilisant IE6 sur votre site ou blog .
Sites prônant la mort d’IE6: