No van los enlaces

manuxdjent · #1 (**permalink**) 13/11/2012, 16:30

¿Alguien me puede decir que he hecho mal? , no me funciona el enlace que quiero ponerle a la imagen "sp.png".

Código HTML:

<HTML>
<HEAD>
<STYLE type="text/css">



body{ 
margin:0;
padding:0;
background-position:center center;
background-color: black;
background-image:url(fondo.png);
background-repeat: no-repeat;
-webkit-background-size:100%;
-moz-background-size:100%;
height: 100%;

} 

#contenedor{

width:592px;
height:600px;
position:absoulte;
margin:0 auto;
margin-top:5%;
}

#logo{
margin-left:20%;
-webkit-animation-name: logo	;
-webkit-animation-timing-function: linear;
-webkit-animation-duration: 1s;
-moz-animation-name: logo	;
-moz-animation-timing-function: linear;
-moz-animation-duration: 1s;
}
#luz{
margin-top:4%;
margin-left:20%;
}

@-webkit-keyframes logo {
  from { margin-left: -20%; opacity:0;  }
  to   { margin-left:20%; }
}
@-moz-keyframes logo {
  from { margin-left: -20%; opacity:0;  }
  to   { margin-left:20%; }
}
@-webkit-keyframes spain {
  from { opacity:0; margin-left:-80%;   }
  to   { opacity:1; }
  }
 @-moz-keyframes spain {
  from { opacity:0; margin-left:-80%;   }
  to   { opacity:1; }
}
@-webkit-keyframes eng {
  from { opacity:0; margin-left:140%;   }
  to   { opacity:1; }}
  @-moz-keyframes eng {
  from { opacity:0; margin-left:140%;   }
  to   { opacity:1; }
}
#ondas{
margin-top:10%;
margin:0 auto;
z-index:-1;
position:relative;
}
#spain{
margin-top:1%;
margin-left:39%;
position:absolute;
-webkit-animation-name: spain	;
-webkit-animation-timing-function: linear;
-webkit-animation-duration: 1.2s;
-moz-animation-name: spain	;
-moz-animation-timing-function: linear;
-moz-animation-duration: 1.2s;
}
#english{
margin-top:1%;
margin-left:58%;
position:absolute;
-webkit-animation-name: eng	;
-webkit-animation-timing-function: linear;
-webkit-animation-duration: 1.2s;
-moz-animation-name: eng	;
-moz-animation-timing-function: linear;
-moz-animation-duration: 1.2s;
}
#barra{
margin-left:55%;
position:absolute;
}
</STYLE>
</HEAD>
<BODY>
<DIV id="contenedor">
	<DIV id="logo">
	<IMG src="logo.png"/>
	</DIV>
	<DIV id="luz">
	<IMG src="luz.png"/>
	</DIV>
	<DIV id="ondas">
		<DIV id="spain">
			<A href="http://antaresproductions.xtrweb.com/antila/inicio.html"><IMG src="sp.png"/></A>
		</DIV>
		<DIV id="barra">
			<IMG src="barra.png"/>
		</DIV>
		<DIV id="english">
			<IMG src="english.png"/>
		</DIV>
	<IMG src="ondas.png"/>

	</DIV>
</DIV>

</BODY>
</HTML>

manuxdjent · #2 (**permalink**) 13/11/2012, 16:34

Me he respondido a mi mismo, he quitado el z-index: -1 del div que tenia debajo ya que no hacia falta porque estaba en relative.