[Résolu] Problème d'affichage d'un code HTML

Bonjour.

J'utilise ce style CSS pour l'affichage d'un code :

.text-code {
	background-color: #EEEEEE;
	border: 1px solid #CCCCCC;
	padding: 0 10px;
	margin: 0 25px;
	font-size: 1.2em;
	color: #117714;
}

Que je balise ainsi dans ma page :

<div class="text-code">
<pre><code>.style { /* Lignes */}</code></pre>
</div>

Tout va bien lorsqu'il s'agit d'afficher du CSS mais le balisage n'est pas pris en compte quand c'est du HTML et par exemple, pour une photo, j'obtiens l'affichage de la photo au lieu du code correspondant.

Merci de votre aide.
Modifié par Nerva (07 Jun 2012 - 13:02)

Salut,

Il faut remplacer les chevrons par leur équivalent : & lt; et & gt; (sans les espaces après &)

Eh bien merci...

Par contre tu as plein de balises inutiles:

.text-code {
	background-color: #EEEEEE;
	border: 1px solid #CCCCCC;
	padding: 0 10px;
	margin: 0 25px;
	font-size: 1.2em;
	color: #117714;
        [b]white-space: pre;[/b]
}

<code class="text-code">
.style { /* Lignes */}
</code>

Ca allégerait effectivement le balisage mais apparemment ça ne fonctionnerait que si le code n'était pas contenu dans un cadre coloré et borduré. Là, chaque ligne est encadrée sur fond jaune (proportionnellement à la longueur de la dite ligne), avec sa propre bordure périphérique et ça ne fait pas joli du tout.
Modifié par Nerva (07 Jun 2012 - 15:41)