[SOLUCIONADO] CSS genérico para un grupo de clases

[El_LoBooo]

Hola a todos,

Tengo una duda a la hora de dar estilos a un grupo de clases sin necesidad de llamar individualmente a cada una de ellas. Me explico, éstas clases comparten la cadena "group" y, dinámicamente a través de php, carga el ID de un módulo para añadirlo a la clase, de forma que quedan:

.group1
.group2
.group3

Y así sucesivamente.

En total salen más de 200 clases que van a compartir todas las propiedades. Sé que puedo llamarlas a todas y compartir atributos:

.group1, group2, group3 {
...
...
}

Pero son tantas clases que no sé si en CSS3 existe alguna forma para que pueda asignar las propiedades a una única clase:

.group {
...
...
}

Ésto anterior sé que no es correcto, pero... ¿Se puede hacer de alguna manera?

Un saludo.

[pzin]

¿Y para qué enumeras las clases si van a ser iguales?

Código CSS:

.group {}
 

...no te vale?

[alzacon]

Claro que puedes agrupar las propiedades identicas en una clase y mantener las diferencias en otras. Luego tendrás aplicar al elemento html la clase group y la groupN.

¿Por qué no sería correcto?

[El_LoBooo]

Iniciado por pzin

¿Y para qué enumeras las clases si van a ser iguales?

Código CSS:

.group {}
 

...no te vale?

Es algo que he intentado pero creo que al final me va a dar mucho más trabajo. Las clases se enumeran dinámicamente ya que corresponden a módulos independientes. En concreto éstos son "group" pero hay muchísimos más que se generan de la misma forma a través de otro archivo auxiliar, de ahí que pretenda hacerlo mediante CSS.

Alzacón no sé si me he explicado mal o no te he entendido yo bien, lo que pretendo es a través de CSS cargar todas las clases groupN en una única clase sin llamar a las 200 group1, group 2,.... {} No sé si me explico.

[alzacon]

Tú tienes muchas clases que tiene propiedades repetidas y quieres agrupar esas propiedades, ¿no?

Pues pzin(creo) y yo te estamos diciendo de crear una clase que agrupe a las propiedades repetidas. Luego tendrias que llamar a la clase "agrupadora" y a la diferenciadora en el html.

Ejemplo con group dando tamaño y groupN definiendo el color de fondo

Código HTML:

<div class="group group1"></div>
 

[El_LoBooo]

Iniciado por alzacon

Tú tienes muchas clases que tiene propiedades repetidas y quieres agrupar esas propiedades, ¿no?

Pues pzin(creo) y yo te estamos diciendo de crear una clase que agrupe a las propiedades repetidas. Luego tendrias que llamar a la clase "agrupadora" y a la diferenciadora en el html.

Ejemplo con group dando tamaño y groupN definiendo el color de fondo

Código HTML:

<div class="group group1"></div>
 

Efectivamente no te entendí yo bien antes. Es una posible solución similar a la que decía pzin, el problema es lo que comentaba en el anterior mensaje, aunque éstos compartan todos la cadena "group" hay otros muchos (miles) de módulos que se cargan a través del mismo archivo php pero con otros sufijos. Voy a investigar un poco la forma de hacerlo porque me parece una buena manera de solucionarlo aunque tengo que reprogramar algunas cosas.

Un saludo.

[alzacon]

También se podría seleccionar los elementos con las clases que empiecen por "group"

Código CSS:

[class^="group"]{}
 

Sólo funcionaria si el elemento tiene una cadena de clase que empieza por group. Yo usaría mejor lo de la clase "agrupadora" para evitar problemas futuros.

[pzin]

Realmente no es un problema de CSS. Ya que CSS prevé estas cosas y para eso existen las clases, para agrupar estilos que se repiten. Lo del selector de atributos es una solución si, pero me parece un tanto exagerado y equívoco.

El problema si acaso lo tienes desde PHP, de cómo definir las clases para unos u otros elementos. Porque en lo que es CSS está claro, mismos estilos, una clase y para los estilos que son diferentes, pues en otra clase.

Código CSS:

.group {
  padding: 20px;
}
 
.group.important {
  background: red;
}
 
.group.important.done {
  border: 2px solid;
}
 

Código HTML:

<p class="group"></p>
<p class="group important"></p>
<p class="group important done"></p>
 

Que es básicamente lo que ya te habíamos dicho.

[El_LoBooo]

Gracias chicos,

Al final lo he resuelto a través de PHP e indicando con CSS tal y como lo habéis planteado.

SOLUCIONADO

Gracias.