Problema con mi hover

[DarkBass]

Pues parcialmente resolvi mi problema con los hovers, el problema es que en una pagina testeada si funca, pero en el famoso myspace parece no querer jalar:

Código:

a#Menu1 {display: block;
width: 481px;
height: 28px;
background: #666 url("http://i191.photobucket.com/albums/z61/Darck_mario/Mi%20Myspace%20XD/Menu1-2.png") no-repeat;
position:absolute; top:795px; left:154px; height:1%; width:30; background:transparent; border-left:0px solid black; border-right:0px solid black; padding-top:4px; padding-left:4px; padding-right:4px;
}
a#Menu1:hover {background: #666 url("http://i191.photobucket.com/albums/z61/Darck_mario/Mi Myspace XD/menu1-1.png") no-repeat;
}

a#Menu2 {display: block;
width: 57px;
height: 28px;
background: #666 url("http://i191.photobucket.com/albums/z61/Darck_mario/Mi%20Myspace%20XD/Msp2-2.png") no-repeat;
position:absolute; top:795px; left:635px; height:1%; width:30; background:transparent; border-left:0px solid black; border-right:0px solid black; padding-top:4px; padding-left:4px; padding-right:4px;
}
a#Menu2:hover {background: #666 url("http://i191.photobucket.com/albums/z61/Darck_mario/Mi%20Myspace%20XD/Msp2-1.png") no-repeat;
}

a#Menu3 {display: block;
width: 79px;
height: 28px;
background: #666 url("http://i191.photobucket.com/albums/z61/Darck_mario/Mi%20Myspace%20XD/Msp3-2.png") no-repeat;
position:absolute; top:795px; left:692px; height:1%; width:30; background:transparent; border-left:0px solid black; border-right:0px solid black; padding-top:4px; padding-left:4px; padding-right:4px;
}
a#Menu3:hover {background: #666 url("http://i191.photobucket.com/albums/z61/Darck_mario/Mi%20Myspace%20XD/Msp3-1.png") no-repeat;
}

a#Menu4 {display: block;
width: 78px;
height: 28px;
background: #666 url("http://i191.photobucket.com/albums/z61/Darck_mario/Mi%20Myspace%20XD/Msp4-2.png") no-repeat;
position:absolute; top:795px; left:770px; height:1%; width:30; background:transparent; border-left:0px solid black; border-right:0px solid black; padding-top:4px; padding-left:4px; padding-right:4px;
}
a#Menu4:hover {background: #666 url("http://i191.photobucket.com/albums/z61/Darck_mario/Mi%20Myspace%20XD/Msp4-1.png") no-repeat;
}

y este es el html

Código:

<div id="Men1">
<a href="http://www.myspace.com/darckscientistmad" id="Menu1"></a>
</div>

<div id="Men2">
<a href="" id="Menu2"></a>
</div>

<div id="Men3">
<a href="http://www.facebook.com/group.php?gid=21122929373&v=wall#!/profile.php?id=100000176631566" id="Menu3"></a>
</div>

<div id="Men4">
<a href="http://www.twitter.com/Marcos_RvZ" id="Menu4"></a>
</div>

no veo donde este el error, pero por mas que le testeo no funca, alguna sugerencia?

[DarkBass]

¿Ninguna idea? :(

[alexk]

esta un poquito mal tu codigo...
en el CSS tienes selectores como
a#Menu4{}
estas indicando que #Menu4 es una etiqueta <a> cuando es un <div> y el <a> esta dentro de este osea un selector valido en tu caso seria
#Menu4 a{}
luego en tu CSS tus selectores son #Menu1,#Menu2, etc... y en tu HTML tus clases son #Men1,#Men2, etc... ya sea myspace o donde sea jamas funcionara como lo tienes, ademas mucha posicion absoluta sin declarar una relativa... para que no floten por todos lados bordes mal usados, medidas repetidas e incompletas etc.. etc... mucho error en tan poco codigo... te recomiendo hacer denuevo tu menu y con mas calma y validando tu codigo

[DarkBass]

Trate de solucionarlo con relative y de plano no salio :( no podrias orientarme un poco mas? la idea es un menu en el que cada elemento haga hover la segunda imagen con la primera :X

[alexk]

Iniciado por alexk

mucho error en tan poco codigo... te recomiendo hacer denuevo tu menu y con mas calma y validando tu codigo

es lo mas que te puedo sugerir... bueno eso y que mires las FAQS CSS y que leas http://librosweb.es/ para entender mas sobre XHTML/CSS.