[SOLUCIONADO] Estilos diferentes de vínculos en clases distintas

[Elalux]

Que tal maestros he aquí mi cuestión, tengo un menu horizontal, quiero que la primera opción tenga un fondo rojo, a continuación los códigos:

HTML

<div class="opcion_nivel1_select"><a href="#">Productos</a></div>
<div class="opcion_nivel1"><a href="#">Entradas</a></div>
<div class="opcion_nivel1"><a href="#">Salidas</a></div>

CSS

.opcion_nivel1_select {
float: left;
padding: 10px;
background: red;
}

.opcion_nivel1 {
float: left;
padding: 10px;
}

Hasta aquí todo bien, ahora lo que deseo hacer es que el texto del vínculo de la clase opcion_nivel1_select aparezca en color blanco, para ello agregué la linea que apaarece en negritas en el CSS.

.opcion_nivel1_select {
float: left;
padding: 10px;
background: red;
}

a.opcion_nivel1_select { color: #FFFFFF; }

.opcion_nivel1 {
float: left;
padding: 10px;
}

Pero no funcionó, los vínculos de esa clase siguen apareciendo en azul, leí en las FAQ's una forma de hacerlo pero poniendo el estilo directamente en la etiqueta <a...> ¿No se puede hacer que una clase tenga un color para los vínculos y otras colores diferentes?

Espero haber explicado bien la situación, agradezco desde ahora cualquier ayuda.

Saludos.

[Naahuel]

Tu error es el selector:

Código CSS:

a.opcion_nivel1_select{
  /* Selecciono un <a> que contiene la clase "opcion_nivel1_select" *¨/
}
 

Cuando debería ser:

Código CSS:

.opcion_nivel1_select a{
  /* Selecciono un <a> que es hijo de un elemento con la clase "opcion_nivel1_select" *¨/
}
 

[Elalux]

Muchas grácias Naahuel lo voy a probar.

Saludos.