"hover" no funciona correctamente en el navegador
Publicado por Gabriel (2 intervenciones) el 28/01/2017 22:58:29
¡Hola, qué tal!
Tengo un temilla con la opción "hover". Para ir viendo los cambios que aplico al archivo ".css" en simultáneo utilizo la página web de CSSDesk. Resulta que los "hover" que programé cambian bien de colores cuando los pruebo con el cursor en esa página, pero cuando ejecuto el archivo ".html" guardado (y su ".css" asociado, por ende) en el navegador (probé varios: Chrome, Explorer, Firefox) no funciona de la misma manera. Sólo cambia el "background-color", pero el color del borde y el del texto permanecen igual que antes. La opción "hover" la usé en estas 3 distintas cosas (h1, h2, y li) y en todas me pasa lo mismo, acá abajo copio una de las 3:
¿Sabe alguien a qué se puede deber el error? Probé de cambiar el lugar del hover y colocarlo antes del otro comando, por si era una cuestión de prioridades (aunque es raro que sí cambie un color y otros 2 no). También intenté solucionarlo poniendo el "!important", pero no hubo caso. ¡Muchas gracias, de antemano!
Tengo un temilla con la opción "hover". Para ir viendo los cambios que aplico al archivo ".css" en simultáneo utilizo la página web de CSSDesk. Resulta que los "hover" que programé cambian bien de colores cuando los pruebo con el cursor en esa página, pero cuando ejecuto el archivo ".html" guardado (y su ".css" asociado, por ende) en el navegador (probé varios: Chrome, Explorer, Firefox) no funciona de la misma manera. Sólo cambia el "background-color", pero el color del borde y el del texto permanecen igual que antes. La opción "hover" la usé en estas 3 distintas cosas (h1, h2, y li) y en todas me pasa lo mismo, acá abajo copio una de las 3:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
li {
display: inline-block;
color: rgba(255, 93, 27, 0.9);
font-family: Orbitron, sans-serif;
font-size: 15px;
letter-spacing: 1px;
padding: 6px;
margin: 10px 5px 1px 5px;
border-width: 1px;
border-color: rgba(255, 93, 27, 0.9);
border-radius: 3px;
}
li:hover {
color: E1B41C;
background-color: rgba(131, 138, 167, 0.3);
border-color: E1B41C;
}
¿Sabe alguien a qué se puede deber el error? Probé de cambiar el lugar del hover y colocarlo antes del otro comando, por si era una cuestión de prioridades (aunque es raro que sí cambie un color y otros 2 no). También intenté solucionarlo poniendo el "!important", pero no hubo caso. ¡Muchas gracias, de antemano!
Valora esta pregunta
0