Bonjour,

Voilà, je reviens vers vous, car je crois avoir besoin d'aide. J'expérimente (quand j'ai le temps) des propriétés css et j'hésite toujours finalement à continuer à utiliser la balise pre pour exprimer du code. Je vais voir avec l'expérience...

Soit, tout ça pour dire, que dans une balise pre, j'exprime un code avec des commentaires pour mon apprentissage du css...
Comme parfois, je discute du code avec des amis, je me suis dis, pourquoi ne pas agrandir la taille de la police, lorsque je passe la souris sur le commentaire via over.

Voici l'essentiel du code :

Code html : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
 
 
		<h1>Balise pre avec code, puis commentaire</h1>
		<div id="main"><pre><code>
<code class="selecteur">body</code><!-- Désolé, pour l'indentation, mais la balise pre m'y oblige -->
	{
 	font: 11px verdana, sans-serif;
 	background: #AFA99B;
 	<code class="commentaire">/* Pour que la page colle aux bords de la fenêtre du navigateur on met 0 à margin et padding */</code>
 	margin: 0;
 	padding: 0;
	}</code></pre>
	</div>
	<p id="question">
		Pensez-vous qu'il soit possible que la largeur de l'id <em>main</em> s'adapte lorsque l'on passe avec la souris, sur un commentaire (id commentaire) ?
	</p>
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 
h1 {text-align: center; color: #F2D7F0;}
		body
			{
		 	font: 11px verdana, sans-serif;
		 	color: white;
		 	background: #AFA99B;
		 	margin: 0; /* Pour que la page colle aux bords de la fenêtre du navigateur on met 0 à margin et padding */
	 		padding: 0;
			}
		#main {clear: both;margin: auto; width: 721px; border: 0px solid black; background: #76C9C1;}
		.selecteur {color: #ED510E;}
		.commentaire {color: #3661A5;}
		.commentaire:hover {
			font-weight: bold;
			font-size: 14px;
			/* word-wrap: break-word; */ /* Je ne vois pas de différence à voir sur le net */
			/* white-space: pre-wrap; */ /* Passe à la ligne, pas mal, mais pas convaincant. */
			}
		#question {color: #D65E8C; font-size: 14px;}
		p {width: 721px; margin: auto; background: #E6E6E6; text-align: center;}

Vous pouvez avoir un aperçu ici
Pensez-vous qu'il soit possible en CSS que la largeur de l'id main s'adapte lorsque l'on passe avec la souris, sur un commentaire (id commentaire) ?

Pour l'instant, j'ai essayé avec ceci (ce que j'ai mis en commentaire) :
Code css : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
 
.commentaire:hover {
			font-weight: bold;
			font-size: 14px;
			/* word-wrap: break-word; */ /* Je ne vois pas de différence à voir sur le net */
			/* white-space: pre-wrap; */ /* Passe à la ligne, pas mal, mais pas convaincant. */
                       }

Cordialement,