Sélecteur universel * {margin:0; padding:0} qu'en dites-vous ?

Blog ElMoustiko
Leftjustified
Blog Alsa
Markwiens

Suite à ces lectures (ci-dessous), je m'interroge sur le bien fondé de la technique de la suppression systématique de toutes les marges (internes, externes) de tous les éléments du document via le sélecteur universel (*)

* {margin:0; padding:0}

J'avoue que je suis mitigé (mais je suis prêt à me laisser convaincre), même si le principe semble pratique... notamment par le fait de devoir ensuite rétablir les marges de chaque élément (notamment les paragraphes).

Quel est votre avis sur l'emploi de cette méthode. Vous semble-t-elle entièrement justifiée quel que soit le cas ?
Merci de discuter de cette méthode du Reset (ou "global white space reset")

PS : d'ailleurs, on peut même aller plus loin en ajoutant une bordure de 0 par exemple :

* {margin:0; padding:0; border:0}

Ah je n'avais pas pensé à la bordure. Y-t-il beaucoup d'éléments pour lesquels les bordures ont des aspects variables en fonction des navigateurs ?

Concrètement je suis toujours embêté par les marges et les padding, mais je ne me souviens pas de problème pénible avec des bordures.

Par ailleurs, je n'ai pas encore détecté de cas vicieux avec le sélecteur *.

Xavier a écrit :

Concrètement je suis toujours embêté par les marges et les padding, mais je ne me souviens pas de problème pénible avec des bordures.

Bah, ça évite d'avoir à faire un

a img {border: 0;} 

Mais est-ce vraiment utile ? Je ne sais pas : j'ai proposé cela en espérant que d'autres, moins fatigués que moi, trouvent des applications plus pertinentes

Simplement par prudence, je défini déjà des padding: 0; et margin: 0; pour tous les éléments de type bloc incluant le <div>, sauf si une autre valeur est nécessaire. Cependant, je ne vois pas l'intérêt de tout définir à 0 et de redéfinir ensuite si ce n'est de sauver quelques bits de code.

Une impression s'installe de plus en plus en moi... J'ai le sentiment que toutes les normes (ou standards) brident de plus en plus la façon de faire un site. Par exemple, un de mes grands regrets lorsque je suis passé au xHTML, c'est de ne plus pouvoir faire des liens externes, des _blank. Y a-t-il vraiment des raisons censées à cela ? Oui, peut être que le visiteur a le droit de décider de ce que son navigateur va faire, mais combien de personnent s'en soucient vraiment ? Au moins 80% (d'après moi) des internautes cliquent sur un lien sans même regarder ce qui s'affiche dans la barre d'état ! Alors que ça s'ouvre dans une nouvelle fenêtre ou non, franchement...

pickupjojo a écrit :

Par exemple, un de mes grands regrets lorsque je suis passé au xHTML, c'est de ne plus pouvoir faire des liens externes, des _blank.

L'attribut target est permit autant en XHTML qu'en HTML. C'est en passant du Transitionnal au Strict qu'il devient interdit.

J'ai fait la recherche suivante pour toi :
Rechercher target

Et puis quel rapport avec le présent sujet ?
Modifié le 30 Nov 2004 - 02:54

Merci Stephan, j'allais dire pareil, tu m'évites d'écrire, en plus je me serais étendu sur le sujet !

Pour le sélecteur universel, Raphaël sait que j'en suis dingue, j'étais tout fou quand j'ai lu l'article de left justified, tellement simple que je n'y avais pas pensé !

En fait en général les marges de paragraphe, on les changes à notre guise, donc il faudrat souvent les redéfinir de toute façon, donc autant les zapper dès le début.

C'est vachement bien dès qu'on utilise des listes, <ul>, <ol>, <dl> parceque là padding et margin s'en mèle allègrement (voir : http://blog-and-blues.org/weblog/2004/09/19/302-gerer-espace-a-gauche-liste-selon-les-navigateurs )

Et au delà de ça, on est pas obligé de spécifier des marges nulles pour TOUT le document, on peut très bien annuler margin et padding de tous les élément contenu dans un autre :

élément/id/class * { margin: 0 ; padding: 0 ; }

Pour ce qui est du border... euh franchement, je vois pas trop pourquoi Il n'y a en gros que img qui à des bordures par défaut (enfin parmi les éléments les plus classiqument utilisés).

Par contre, le faire pour la couleur, pourquoi pas, il peut être pratique de spécifier la couleur de texte pour tout le document, mais là je crois que le faire dans le body suffit.

Tiens ! Ça me rappelle un article de Tantek Çelik.

Undoing html.css and using debug scaffolding

http://tantek.com/log/2004/undohtml.css
Modifié le 30 Nov 2004 - 07:22

Bonjour à tous

Je suis de l'avis d'ElMoustiko ! Je trouve ce sélecteur universel vraiment très pratique pour remettre tout à plat une bonne fois pour toute. Ne serait ce que pour faciliter le travail quand on passe de IE à FF/Opera (et encore, Opera applique des marges là où FF n'en met pas).

Avec cette solution, on passe pas 3H à se demander d'où vient le décalage qui existe entre chaque navigateur. Il m'est arrivé de perdre pas mal de temps pour savoir pourquoi mes titres étaient tant espacés des paragraphes sur tel navigateur et pas sur un autre. En initialisant les marges et padding à 0 au début de la CSS, on gomme en quelque sorte ces différences.
Je trouve qu'il en existe déjà tellement (des différences) que dans la mesure où on peut en supprimer quelques unes, pourquoi ne pas le faire ?

Et puis, je ne sais pas vous, mais je ne teste pas toutes mes pages sur Opera, IE et FF ... j'en teste la plupart mais il arrive que je ne vérifie pas l'affichage de toutes mes balises. Donc, le sélecteur universel est mon ami car il me fait gagner du temps quand je teste sur les plateformes

PS : Maintenant, je vais me présenter dans la partie "Présentation" avant que quelqu'un me tire les oreilles

J'approuve totalement des dires d'ElMoustiko et d'Azon, ça permet de partir... à 0. Je l'utilise tout le temps.

Personnellement je suis contre. Oh, il m'arrive d'utiliser des choses du genre, mais globalement je suis contre.
Quand j'ai besoin de contrôler précisément la marge ou le padding de tel ou tel élément alors je le règle, mais quand ce n'est pas le cas, le but est *justement* de laisser les préférences utilisateur.
Ce genre de règle est intéressante quand le design est cadré entièrement au pixel, quand le but c'est de tout contrôler. Et si dans le Web le but c'était au contraire d'en contrôler le moins possible pour nos besoins ? C'est plus la philosophie que j'ai. Mes titres ont généralement les tailles et marges par défaut, ça ne casse pas grand chose dans le design mais ça respecte au mieux les défauts et préférences éventuelles.
Puis il faut bien voir qu'en général les défauts ne sont pas si mal choisis que ça.

Ah enfin un partisan du "non", je commençais à désespérer de l'intérêt d'un tel sujet

a écrit :
le but est *justement* de laisser les préférences utilisateur.

En même temps, il s'agit plus de préférences navigateurs que de préférences utilisateur, non ?

Les feuilles de style utilisateurs prendront de toute façon le dessus sur les styles webmasteur, donc l'argument n'est pas tellement valable

Je vais dire une connerie, mais le fais d'utiliser cette méthode ne serait pas une bonne solution pour gérer les différences de comportements entre IE et le reste du monde ?

Je veux dire que si il est possible de définir une fois pour toute des valeurs de marge et de padding à zéro, il doit être possible de le faire aussi avec des valeurs négative, non ?

Donc pourquoi pas utiliser une partie du fichier css en switch en fonction du navigateur de l'utilisateur, puis le reste de la feuille de style pourrait s'appliquer de la même manière pour tous les navigateurs, non ?

ernstein a écrit :
Je veux dire que si il est possible de définir une fois pour toute des valeurs de marge et de padding à zéro, il doit être possible de le faire aussi avec des valeurs négative, non ?

Pourquoi des marges négatives ? Dans quel intérêt ?

il m'a semblé à la lecture des différents doc que la gestion des boites d'IE était différentes des autres softs, n'est t'il pas possible de prendre en compte cette différence une fois pour toute avec le selecteur universel ?

J'ai pas encore trouvé le temps de bosser CSS, j'me contente pour l'instant de développer un système de vente en ligne en XHTML strict. Donc je divague peut être.

ernstein a écrit :
il m'a semblé à la lecture des différents doc que la gestion des boites d'IE était différentes des autres softs, n'est t'il pas possible de prendre en compte cette différence une fois pour toute avec le selecteur universel ?

Non, le sélecteur universel, avec cette méthode du "reset" ne fera qu'annuler les marges (externes et internes) de tous les éléments pour avoir un rendu de base équivalent par défaut.

Par contre, il n'interfère en rien les calculs des modèles de boîte : IE va toujours considérer que la largeur (width) d'un élément sera égale à (width + padding + border)

merci ....

c'est clair.....

Félicitation pour ton 1000éme post !!!!
Modifié le 01 Dec 2004 - 11:56