[SOLUCIONADO] Calc y contar elementos CSS3

[0123]

Buenas,

Estoy buscando como contar elementos, seguramente se pueda solo con CSS3, pero no encuentro la variable.

Código CSS:

.misalon p{ width:calc(100% / 3)}
 

Código HTML:

<div class="misalon">
<p>hola</p>
<p>mundo</p>
<p>bonito</p>
</div>
 

¿Existe alguna forma de que ese "3" sea dinamico, osea... contar de algun modo los parrafos que hay en "misalon"?... seguro que se puede. :D

[pzin]

Directamente no se puede. Hay algún que otro invento por ahí como esto:

Código CSS:

.misalon p:first-child:nth-last-child(1) {
    width: 100%;
}
 
.misalon p::first-child:nth-last-child(2),
.misalon p::first-child:nth-last-child(2) ~ li {
    width: 50%;
}
 
.misalon p::first-child:nth-last-child(3),
.misalon p::first-child:nth-last-child(3) ~ li {
    width: 33.3333%;
}
 
.misalon p::first-child:nth-last-child(4),
.misalon p::first-child:nth-last-child(4) ~ li {
    width: 25%;
}
 
.misalon p::first-child:nth-last-child(5),
.misalon p::first-child:nth-last-child(5) ~ li {
    width: 20%;
}
 

Que hace lo que buscas.

Hasta que salgan flexblox, regions y demás módulos de estructuración esto es lo que hay. A excepción de otra técnica que pudieses usar, que sería simular tablas/celdas con:

Código CSS:

p {
  display: table-cell;
}
 

Así no tendrías que especificar ningún ancho, ya que al igual que las celdas de una tabla, se repartirían el ancho.

[0123]

Muchas gracias pzin, gracias por tanta aclaración.

El toque de display: table-cell; en este caso no me sirve... pero gracias!... me va a tocar hacer uso de js.. que pereza!.

Aio!