Babylon Design

par Samuel Le Morvan

Chez vous aussi, utilisez un Web de qualité

Tutoriels HTML/CSS

Revigorez vos travaux d’intégration en suivant les préconisations des instances mondiales de l’Internet !

Tutoriels HTML/CSS

Quelques hacks CSS pour différencier les navigateurs

L’intercompatibilité des navigateurs ou la croisade permanente de l’intégrateur. Pour rappel, voici des petits trucs pour faciliter l’intégration d’une page web, mais attention les hacks CSS c’est comme l’alcool : À consommer avec modération !

J’insiste mais n’utilisez pas les hacks CSS constamment. La plupart des bugs d’affichages se résolvent souvent en utilisant les propriétés classiques.

Pour IE 5.5 :
.element {    propriété:valeur; /* Lu par IE 5.5 */    voice-family: "\"}\""; voice-family: inherit;    propriété:valeur; /* Non lu par IE 5.5 */ }
Pour IE 6 :
* html .element {    propriété:valeur; /* Lu uniquement par IE 6 */ }
Pour IE 7 :
*:first-child+html .element {    propriété:valeur; /* Lu uniquement par IE 7 */ }
Pour Safari 1 & 2 :
body {    display:block;    #    /* Tout le code CSS après la dièse ne sera pas lu par Safari */ }

Voir la page de test


Ce que nos lecteurs en disent :

  1. Benjamin

    Merci pour ces précieuses informations !
    C’est fortement utile lorsque l’on se trouve face à un problème d’affichage

  2. Monique

    Bonjour,

    Tu as raison, l’abus de hack… n’empêche, c’est toujours bon à avoir sous le coude au cas où ;)

    Amicalement,
    Monique

  3. CurtisNewton

    Ca fait (malheureusement) un petit moment que je n’ai pas eu l’occasion de coder, mais perso j’ai toujours beaucoup apprécié les "conditional comment" <!–[if IE 6]>
    Special instructions for IE 6 here
    <![endif]–> (plus d’infos sur http://www.quirksmode.org/css/co... valable pour des versions spécifique d’IE ou pour toutes les versions en fonction des besoins. Beaucoup plus pratique a mettre en place et a identifier quand les test sont terminés.

Les commentaires sont clos.