28221 sujets

CSS et mise en forme, CSS3

Bonjour,

Je ne comprends pas ce qui n'est pas correct dans ce code :

<?xml version="1.0" encoding="utf-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr-fr">
<head>
	<style type="text/css">
.tableau>code	{white-space:pre}
	</style>
</head>

<body>
<p class="tableau"><code>em</code>=><code>em1</code>
<code>strong</code>=><code>em2</code></p>
</body>
</html>


Je veux afficher ceci :

em=>em1
strong=>em2


La ligne .tableau>code, si je comprends bien (je me fie à SelfHTML) signifie :« si l'élément code suit immédiatement un élément de classe tableau ».

Où ais-je fait l'erreur ? Merci
Modifié le 22 Jan 2005 - 07:12
À mon avis, les sélecteurs d'enfant concernent seulement les éléments et non les sélecteurs par classe.
[ mais il semble que j'ai tort Smiley lol ]
http://www.yoyodesign.org/doc/w3c/css2/selector.html#x13

Je n'ai pas vraiment compris ce que tu veux faire avec white-space dans ce contexte.
http://www.yoyodesign.org/doc/w3c/css2/text.html#propdef-white-space

Cependant, tu peux essayer avec p>code !

Dis-nous ce que ça donne (pas dans IE puisqu'il ne reconnait pas le sélecteur d'enfant). Smiley cligne
Modifié le 31 Jan 2005 - 07:18
Merci de l'info. Je ne suis pas certain mais ce serait un peu long à expliquer (et je ne saurais pas par où commencer)

Mon objectif et de ne pas utiliser pre, qui n'a rien à faire dans la structure (je ne vois pas de différence entre pre et whitespace:pre et le premier n'influe que sur la présentation).
T'aurais pas un conflit avec tes "flèches" ?Je sais pas si c'est autorisé en xml - xhtml - html d'avoir ">" ou "<" dans ton texte.

Tu devrais peut-être les remplacer par &lt; et &gt; , non ?

@+, HoPHP
Modifié le 22 Jan 2005 - 11:10
En fait, mon code original n'utilise pas des flèches ASCII mais des flèches Unicode. Mais comme ce forum ne reconnait pas les caractères Unicode, j'ai remplacé par des flèches pour les besoins de l'exemple.

Inutile de préciser que, flèches ASCII ou Unicode, le problème reste entier.
L'absence du résultat escompté... est tout à fait normale Smiley cligne

En effet, withe-space dit au navigateur de respecter les retours à la ligne présent dans l'élément concerné...

... Et il n'y a aucun retour à la la ligne dans le contenu de tes éléments <code> Smiley lol

Applique white-space à .tableau (c'est parfaitement correct, Stephan) ou modifie ta structure pour que <code> englobe tout le contenu à afficher ainsi, sauts de ligne compris.
Je réagis avec du retard…

<p class="tableau"><code>em</code>=><code>em1</code>
<code>strong</code>=><code>em2</code></p>


Et le retour chariot entre em1</code> et <code> ?

J'ai aussi essayé avec un saut à la ligne en plus, pas mieux.
Modifié par David Latapie (22 Feb 2005 - 13:11)