Estoy intentando hacer una lista numerada del tipo 1 / 1.1 / 1.2 / 1.2.1 / 1.3 /... estoy siguiendo las especificaciones del consorcio, pero no consigo que se vea bien en ningún navegador.
Seguramente que de marearla tanto y de probar de una manera y de otra, debo de estar pasando por alto algo. Pero ya no sé que hacer.
Pongo el código a ver si alguien sabe qué pasa y me puede orientar.
Perdonad los colores de fondo pero era para ver bien los márgenes
Código:
<style type="text/css">
<!--
body{
background: #0000ff;
}
#uno{
background: #00ff00;
border-width: 10px;
border-color: #ffffff;
}
ol{
margin: 5px;
padding: 5px;
}
li{
padding-left: 5px;
margin-left: 5px;
}
// Si lo hago asi : Con mozilla no se ve ninguna numeración.
// Con IE la numeración empieza en el body no
// en del div como yo quiero, y cada bloque se numera a partir
// de 1. Con opera la numeración no
// respeta los saltos <ol> y sigue como si no existiesen
// tampoco respeta el margen que quiero dar
// entre la numeracion y el texto
ol { counter-reset: item}
li { display: block }
li:before { content: counters(item, ". "); counter-increment: item }
// Si lo hago de esta manera solo consigo
// un poco de margen con opera
ol { counter-reset: item }
li { display: block }
li:before { content: counter(item) ". "; counter-increment: item }
-->
</style>
</head>
<body>
<div id="uno" >
<ol>
<li>uno</li>
<li>dos</li>
<li>tres </li>
<li>cuatro
<ol>
<li>cinco </li>
<li>seis</li>
<li>siete </li>
</ol></li>
<li>ocho
<ol>
<li>nueve</li>
<li>diez</li>
<li>once</li>
</ol></li>
</ol>
</div>
</body>
</html>
