Una regla común a varias reglas de manera que hereden los estilos de la común

[tirengarfio]

Hola,

estoy haciendo una bandeja de entrada de mensajes y quiero darle un color distinto a los mensajes que ya han sido leidos. Tengo estas dos reglas que solo se distinguen en un estilo.

Código:

div.mensaje_1 {
background: #CCC;
border-bottom:2px
border-bottom-style: solid
border-bottom-color: #CCCCCC;
margin-bottom:0;
padding-bottom:19px;
}

div.mensaje_0 {
background: #000;
border-bottom:2px
border-bottom-style: solid
border-bottom-color: #CCCCCC;
margin-bottom:0;
padding-bottom:19px;
}

¿Es posible crear una regla común a ambas de manera que las dos reglas hereden los estilos de la regla común? De esa manera me ahorraria tener que hacer cambios en las dos por ejemplo cuando voy a modificar el padding-bottom por ejemplo.

Un saludo

Javier

[ArturoGallegos]

podrias usar una regla como

Código HTML:

.mensajes{
border-bottom:2px #ccc solid;
margin-bottom:0;
padding-bottom:19px;
}
.mensajes .mensaje_0{
background: #ccc;
}
.mensajes .mensaje_1{
background: #000;
}

de esta forma ambos aplicarian las reglas de mensajes y el estilo extra que les especifiques

[Impostor]

Podrías poner

Código HTML:

div.mensaje_1, div.mensaje_0  {
border-bottom:2px
border-bottom-style: solid
border-bottom-color: #CCCCCC;
margin-bottom:0;
padding-bottom:19px;
}

div.mensaje_1 {
background: #CCC;
}

div.mensaje_0 {
background: #000;
}

Además, la propiedad border la puedes poner como

border-bottom:2px #ccc solid;


Saludos¡¡

[tirengarfio]

Gracias a ambos!