Reset.css : réinitialiser le rendu par défaut des navigateurs

Lors de la préparation d'un design , nous avons tous été confronté à des problèmes de mise en page dans les différents navigateurs.
Notre design qui se présente bien dans Firefox se retrouve déformé dans Internet Explorer (et vice-versa).

Mais ne vous-êtes vous jamais demandé pourquoi un tel comportement ?
Explication et solution font l'objet de cet article.

Pourquoi les navigateurs web présentent-ils les éléments HTML de manière si différente ?

Il semblerait que rien de concret n'ai vraiment été défini par le W3C, si ce n'est le type de l'élément (inline ou block). Ainsi, les développeurs de navigateurs web sont libre de définir leurs propres style par défaut. C'est donc pour ça que les margin, padding ou autre style peuvent être différents selon le navigateur utilisé.

Que pouvons-nous alors faire ?

Ce que nous faison déjà, c'est à dire spécifier nos propres règles CSS.
Si des problèmes persistent, c'est que des règles n'ont pas été 'définies' et donc que c'est le navigateur qui applique son style par défaut.

Le problème vient donc de là : nous ne déclarons pas toutes les règles de style.

C'est pour cela que je vous présente reset.css, une feuille de style destinée à réinitialiser le style des différents éléments (X)HTML, de manière à ce qu'ils ne subissent plus les réglages par défaut du navigateur. Appliqué avant vos propres styles, ce fichier devrait vous éviter de longues prises de tête.

Télécharger reset.css

comments powered by Disqus