28172 sujets

CSS et mise en forme, CSS3

bonjour

Je voudrais mettre en forme un texte en alignant des mots identiques. Pour l'instant je l'ai fait en définissant des positions pour chaque lignes mais c'est fastidieux et approximatif. Quelqu'un aurait-il une idée ? Voici un exemple de ce que je voudrais.
Promenons-nous dans les bois, tant que le loup n'y est pas
si le loup y étais il nous mangerait.
loup y es-tu ?
J'aligne le mot "loup" dans chaque lignes.
Tu ferais bien de prendre une typo à espacement fixe (je crois que c'est le cas de sans-serif) et d'utiliser des   pour incrémenter tes lignes.

A part ça, je vois pas trop.
Salut,

Peut-être un tableau à trois colonnes :
- colonne 1 : début du vers jusqu'au mot (en text-align:right)
- colonne 2 : le mot
- colonne 3 : fin du vers
Skoua a écrit :
Tu ferais bien de prendre une typo à espacement fixe (je crois que c'est le cas de sans-serif) et d'utiliser des   pour incrémenter tes lignes.


urgh Smiley ohwell

En utilisant des span, en lors donnant un rendu block et une largeur/position précise (en ex par exemple) puis en les faisant flotter, ça serait plus propre.
Laurie-Anne a écrit :
En utilisant des span, en lors donnant un rendu block et une largeur/position précise (en ex par exemple) puis en les faisant flotter, ça serait plus propre.

Des span en display: inline-block (et sans positionnement flottant), ça serait mieux. Ou même en display:table-cell, ça serait encore mieux.

Par contre je vois pas d'objection majeure à utiliser un élément PRE (plutôt que des  ) et une typo à chasse fixe. Ce n'est pas forcément la solution la plus esthétique, mais si on a beaucoup d'alignements différents à réaliser alors c'est la solution. Et même pour un seul alignement, ça reste une solution simple et efficace.
Florent V. a écrit :
Des span en display: inline-block (et sans positionnement flottant), ça serait mieux. Ou même en display:table-cell, ça serait encore mieux.


Certes, mais alors il faut prévoir une solution pour IE6, même si on serait dans le cas d'une amélioration progressive.
Administrateur
Bonjour,

j'allais écrire OK pour une fonte à taille fixe (Monaco, etc) et beurk pour les   mais en fait avec l'élément pre, une espace ou un   ça a le même effet donc des espaces et puis c'est plié Smiley smile
Laurie-Anne a écrit :
Certes, mais alors il faut prévoir une solution pour IE6, même si on serait dans le cas d'une amélioration progressive.

???

Si on fait de l'amélioration progressive, pourquoi faudrait-il que ça marche dans IE6?
Florent V. a écrit :
Par contre je vois pas d'objection majeure à utiliser un élément PRE (plutôt que des  ) et une typo à chasse fixe.

Je plussoie.
Florent V. a écrit :

Si on fait de l'amélioration progressive, pourquoi faudrait-il que ça marche dans IE6?


Pour que ce soit quand même joli (tant que c'est possible, pourquoi s'en priver ?).
Laurie-Anne a écrit :
(tant que c'est possible, pourquoi s'en priver ?)

Ce n'est donc pas «il faut» mais «on peut (si on peut)». Smiley lol