Display inline et espace avec retour chariot

Bonjour a tous,

Je vous expose un probleme (si c'en est un) rencontré avec la plupart des navigateurs (c'est a dire, observé sous IE, Opera et Firefox).

Lorsque des éléments sont disposés en "inline" (display:inline), un espce de 4 pixels existe entre eux s'ils ne sont pas aussi en ligne et sans espace dans le source.
Un simple retour chariot dans le source ajoute automatiquement un espace entre ces éléments.

Pour expliquer concretement ce phénomène, j'ai pris l'exemple de simple bouton afficher par defaut en "inline", le tout en image :

Le source :
http://eric.dupouts.free.fr/test/test1.jpg

le rendu :
http://eric.dupouts.free.fr/test/test2.jpg

Testez par vous même via cette page

Alors, ma question est de savoir si ce phénomène est bien connu de tous ? Est-il normal ?

Bien que cela me paraisse étrange, j'ai tendance a croire qu'il n'y a rien de plus normal étant donné que la plupart des navigateurs opèrent de cette façon, qu'en pense vous ?

Merci d'avance et bonne continuation à tous
Modifié par Aldorado (09 Sep 2009 - 15:56)

Aldorado a écrit :
Alors, ma question est de savoir si ce phénomène est bien connu de tous ? Est-il normal ?

Oui, c'est un phénomène connu.

Merci pour la rapidité de ta réponse !

Laurie-Anne a écrit :
Oui, c'est un phénomène connu.

Et bien dans ce cas, gros coup de gueule contre cette norme html
un peu illogique et empeche une bonne lisibilité du code source.

Bonjour,

et si tu voulais un espace et qu'il les enlevait, tu ferais comment?

Aldorado a écrit :
un peu illogique

C'est au contraire extrêmement logique. Gênant dans certains cas, oui, peut-être, mais pas illogique.

Si tu tiens à tes retours à la ligne, tu peux faire:

   <input /><!--
--><input /><!--
--><input />

Tu peux aussi gérer ça en changeant de mode de rendu ou de positionnement pour tes éléments. À priori le plus intéressant serait d'utiliser le positionnement flottant.
Modifié par Florent V. (09 Sep 2009 - 18:27)