¿Problema mio o de Chrome?

[minvallado]

Llevo un par de dias rompiendome la cabeza con esto, al principio creia que era un problema de Chrome, pero no he encontrado este fallo por ningun foro asi que estoy pensando que es cosa mia y no se como puedo solucionarlo. (con script hago que funcione, pero la gracia era hacerlo solo con css)

En firefox funciona como quiero pero en chrome no.
La pagina para que lo veais es esta

http://bajod.es/web/index.html
(el que vea el codigo se hara un lio por que no esta organizado y aun le queda bastante por depurar)
El html me lo valida y el css tambien como css3

Os comento el trozo que me trae de cabeza (tambien se repite con otros elementos de la pagina que tampoco funcionan), espero que se entienda:

.contacto (clase del elemento "contacto")
.tlf (clase del elemento "telefono")
#cnt (identificador del elemento contenido de texto)


.contacto:hover + a + a + a + div + div > .tlf, /*(1) en NO chrome funciona*/
.contacto:focus + a + a + a + div + div > .tlf, /*(2) en NO chrome funciona*/
.tlf:hover { background-position:0 -120px} /*(3) en chrome funciona*/
(esto es valido para Css2.1)

Cuando paso por "contacto"(1) o hago "click"(2), el telefono del "suelo" deberia descolgarse. Cuando paso(3) sobre el telefono se descuelga.


por otro lado... creo que es el mismo error (solo valido para css3)
.contacto:focus + a + a + a + div + div > #cnt, /*(4) en NO chrome funciona*/
.tlf:hover ~ #cnt {display:block} /*(5) en NO chrome funciona*/
.tlf:focus ~ #cnt {display:block} /*(6) en NO chrome funciona*/

Cuando hago "click"(4) en "contacto" o en el "telefono"(6) el texto del div contenido cambia, tambien cuando paso(5) por el telefono.

pensando, pensando (demasiado) he probado con esto (y alguna otra variente... quitando el "~" y poniendolo valido para css2.1) y tampoco funciona
#t:hover ~ div#cnt {display:block} /* en NO chrome funciona*/
#t:focus ~ div#cnt {display:block} /* en NO chrome funciona*/
a.tlf:hover ~ div#cnt {display:block} /* en NO chrome funciona*/
a.tlf:focus ~ div#cnt {display:block} /* en NO chrome funciona*/
div#t:hover ~ div#cnt {display:block} /* en NO chrome funciona*/
div#t:focus ~ div#cnt {display:block} /* en NO chrome funciona*/
.tlf:hover ~ div#cnt {display:block} /* en NO chrome funciona*/
.tlf:focus ~ div#cnt {display:block} /* en NO chrome funciona*/



De IE5 al IE7 no funciona por que tiene otra hoja de estilo ( sin hacer)
Pero en IE8 si que me gustaria que funcionase... pero no he podido probarlo, si alguien me hiciera el favor de comprobarlo, me haria un gran favor.

[zerokilled]

aparte de que no logro hacerlo funcionar en chrome (6.0.472.55), me toma por curioso un detalle. parece que chrome no puede identificar correctamente el elemento cuando se emplea la pseudoclase :hover combinado extensamente con el selector adyacente (sibling). o sea, la unica forma que lo hago funcionar es si se establece :hover justo antes de un nivel adyacente.

Código HTML:

<div><p>paragraph</p>
<p>paragraph</p>
<p>paragraph <strong>strong</strong>, <em>emphatize</em>, <small>small</small></p></div> 

Código:

/* no funciona en chrome */
p:hover + p + p > strong + em + small{
color:red;
}

/* funciona en chrome */
p + p:hover + p > strong + em + small{
color:red;
}

me lleva a la conclusion que la implementacion de chrome en este aspecto es pobre o tiene error.

[minvallado]

Muchas gracias zerokilled.
Voy a buscar una estructura diferente del html... aunque se me antoja muy complicada para resolver la pagina