link visited hover active

[miketrix_esp]

Buenas,

Hay una cosa que me lleva comiendo el coco de hace tiempo. En su día intenté averiguar la solución pero desistí, pero hoy en el trabajo han vuelto a mencionarlo y claro, aquello que dicen de que "no sirve de nada huir de los problemas porque acaban volviendo".

Explico:

Es sobre los estilos de links. No aplica los estilos en todos los estados. Tengo:

Código HTML:

.union:link {
    font-family: Verdana;
	font-size: 8pt; 
	color: #F38D02;
	font-weight: bold; 
	text-decoration: underline;
}

.union:visited{
    font-family: Verdana;
	font-size: 8pt; 
	color: #F7C177;
	font-weight: bold; 
	text-decoration: underline;
}

.union:hover {
    font-family: Verdana;
	font-size: 8pt; 
	color: #F7B357;
	font-weight: bold; 
	text-decoration: none;
}

.union:active {
    font-family: Verdana;
	font-size: 8pt; 
	color: #F38D02;
	font-weight: bold; 
	text-decoration: underline;
}

Es un problema común por lo que he podido observar y casi siempre es debido al orden. Pero yo respeto el orden: link, visited, hover, active. Pero no me funciona.

El hover y el active funciona, lo unico que parece no ir es el visited. Alguna idea del por qué?

GRACIAS

[AlvaroG]

¿y si pones a.union?
Quizás no funcione por ser un estilo genérico, ¿si lo aplicas a enlaces qué pasará?
No creo que sea esto (los navegadores deben ser muuuuuy pelotudos para caer en esto), pero probar no cuesta nada.


Saludos.

[miketrix_esp]

ok, gracias por la respuesta. Mañana lo pruebo y ya te diré si me ha servido tu idea.

(Disculpas por el otro post con la misma pregunta...)

[leoj90]

Pon la clase principal y los links bien, sino no sirve:

.union {
font-size: 8pt;
font-family: Verdana;
}
A.union:link {
color: #F38D02;
font-weight: bold;
text-decoration: underline;
}

A.union:visited {
color: #F7C177;
font-weight: bold;
text-decoration: underline;
}

A.union:hover {
color: #C0C0C0;
font-weight: bold;
text-decoration: underline;
}

[miketrix_esp]

eey, poniendo la clase principal A me ha funcionado! Sois unos cracks!

Muchas gracias, os debo una (b) jeje.

[miketrix_esp]

joee, pues al final no me va del todo bien!

Porque al parecer al principio se ve bien los enlaces que no están visitados pero una vez visitas uno, todos se ponen como visitados. No se que s lo que hago mal!!! :(

Código HTML:

.linkdoc{
   font-family: Verdana, Arial, Helvetica, sans-serif; 
   font-size: 11px; 
   font-weight: bold; 
   line-height:13px;    
}

A.linkdoc:link {
   color: #FF8521; 
   text-decoration: underline;  
}

A.linkdoc:visited {
   color: #FFB375; 
   text-decoration: underline;  
}

A.linkdoc:hover {
   color: #FFB06E; 
   text-decoration: none; 
}

[rin]

Creo que tenés que respetar el orden en que ponés los estilos.
Primero: "a:link"
Segundo: "a:active"
Tercero: "a:visited"
Cuarto: "a:hover"

[josepzin]

http://www.w3schools.com/css/css_pseudo_classes.asp

[baccxus]

Volvemos a mecionar "A" en vez de "a", por favor, los enlaces son <a href="... y si ponemos en la CSS A.noseque:active, no nos funcionará correctamente en navegadores que no sean IE.

Saludos

[miketrix_esp]

Han pasado semanas y todavía no he conseguido solucionar este error

He probado todas las sugerencias:

- he seguido el orden :link :visited :hover :active --> nada
- lo he puesto con la "a" delante (a.clase) --> nada
- he probado otras combinaciones como
:link
:link:hover
:visited
:visited:hover --> nada
- pensé que era por el doctype --> nada tampoco

Lo que más he conseguido es que empezando "limpio" (con el historial del navegador borrado) cuando abro un link, se me keda marcado como el estilo "visited" indica. Pero cuando cambio de pagina todas las paginas pasan al estilo "visited". No entiendo nada... es algo muy raro. Utilizo IE6.

[josepzin]

Te estas liando :)

Yo tambien pase por esa etapa, mira el enlace que te pasé antes y sigue esas instrucciones

a:link {color: #FF0000} /* unvisited link */
a:visited {color: #00FF00} /* visited link */
a:hover {color: #FF00FF} /* mouse over link */
a:active {color: #0000FF} /* selected link */

Pero ten en cuenta que el ACTIVE no funciona. Solo se usa cuando se pincha con el raton, nada mas.

Asi por ejemplo me va bien:

#datos .trabajosList a {
background-color: transparent;
padding: 0 0 8px 0;
border: 0;
text-decoration: none;
display: block;
}
#datos .trabajosList a:link, a:active, a:visited {
color: #444;
}
#datos .trabajosList a:hover {
text-decoration: underline;
color: #000;
background-color: transparent;
}

Esto lo uso dentro del DIV=datos, y dentro del DIV CLASS=trabajosList