28114 sujets

CSS et mise en forme, CSS3

[Resolu]Titre numéroté

Bonjour,

je souheterai que mes titres (h3) soit numérotés, de telle sorte que cela me donne
"I titre1
II titre2
III titre 3",
pour cela, j'ai bien prévu de faire dans mon html
<h3>Titre 1</h3>
<h3>Titre 2</h3><h3>titre3</>

et dans mon css
* h3{list-style-type:upper-roman;display:list-item}


malheureusement, le resultat est loin d'être à la hauteur de mes attentes,
cela me donne
"I titre 1
I titre 2
I titre 3"...en gros il ne compte pas au dessus de I ...

savez vous comment faire?merci

ps : il est bien évident qu'il y a du text entre les titres...
Modifié le 20 Jan 2005 - 19:43
Je dis peut-être une bêtise énorme, mais avec un ol ça marcherait pas ?
On peut mettre des paragraphes entre deux li ?
Skybattle a écrit :

On peut mettre des paragraphes entre deux li ?

Non! Un <ul> ne peut contenir que des <li>.
Mais on peut mettre un <p> ou un <h3> dans un <li>.

Le HTML

<ol>
 <li><h3>Titre 1</h3></li>
 <li><h3>Titre 2</h3></li>
 <li><h3>Titre 3</h3></li>
</ol>

Le CSS :

li { 
   list-style-type: upper-roman; 
}

Et si tu veux des paragraphes :

<ol>
 <li><h3>Titre 1</h3>
  <p>Lorem ipsum...</p>
 </li>
 <li><h3>Titre 2</h3>
  <p>Lorem ipsum...</p>
 </li>
 <li><h3>Titre 3</h3>
  <p>Lorem ipsum...</p>
 </li>
</ol>
Les quelques essais que je viens de faire pour appliquer display: list-item; à un <h3> ne sont pas concluants...
Le code ci-dessus à base de display: list-item n'incrémente pas de compteur. Il se contente de formatter le titre comme un élément de liste.

Pour obtenir une numérotation sur un élément (hors <ol>), il faut passer par un compteur CSS:

h3:before {
    content: counter(foo) "." " ";
    counter-increment: foo;
}


Opera fait ça très bien. Mais ce n'est pas implémenté par IE, ni me semble-t-il par les navigateurs Gecko.
Effectivemen, ca à pas l'aire de marcher avec safari, ni avec iE, ce qui m'embete beaucoup...
connaissez vous d'autres manières?
Sujet clos
Aller à