Balise h1, flux hors boite css

Bonjour

Sur cette page http://www.hasparren.net/essai.html , j' ai installé 4 boites (en rouge) je peux y insérer du texte, des images, mais lorque je veux mettre un H2, il sort de la boite, je suis bloqué, je ne trouve pas la solution, à part mettre une class au lieu du H2, mais je souhaite le garder afin de mettre une couleur de fond sur le H2.

J'ai utiliser ce système de boites afin d' éviter de créer 4 divs supplémentaires, mais si vous avez une idée pour la création de ces boites ( qui ne doivent pas être obligatoirement de la même largeur) je suis preneur.

Merci

Bonne journée





CSS embarqué :

  .flottante {
margin-top: 20px;
float: left;
width: 300px;
background-color: red;
margin: 5px;
}
h2 {
margin-top: 0em; 
margin-bottom: 0em; 
font-weight: bold; 
font-size: 100%; 
font-style: italic;
color: #6C383a;
}

Modifié par africa (17 Jan 2008 - 08:57)

Salut,
ton h1 sort sous IE ? parce que ca marche trés bien sous FF
Modifié par hakkou (17 Jan 2008 - 09:00)

pourquoi ne veux tu pas utiliser de divs?
tu ne peux pas mettre de balise hx dans un paragraphe.

Bonjour,

glow a mis le doigt dessus. Tu as le code suivant, qui est invalide:

<p class="flottante">Je souhaite le h2 dans cette boite 
<h2>H2  hors de la boite   [decu]</h2>
 </p>

Certains navigateurs, si ce n'est tous, vont le lire ainsi:
- j'ouvre un paragraphe;
- je rencontre une balise <h2>, alors que je n'ai toujours pas rencontré de fin de paragraphe;
- je décide que le paragraphe est fini juste avant le h2;
- j'ouvre un élément h2;
- je le ferme;
- je rencontre une balise fermante </p> qui n'a rien à faire là... je l'ignore.

Bref, le code interprété sera le suivant:

<p class="flottante">Je souhaite le h2 dans cette boite</p>
<h2>H2  hors de la boite   [decu]</h2>

Comme quoi, quand on répète qu'il faut valider son code HTML c'est pas pour emmerder les gens, c'est vraiment utile.