Vale, esto empieza a coger forma. Gracias de nuevo.
Pero ahora mesurge otra duda y, creo que bastante más compleja. Bueno compleja para mí para vosotros no creo.
Código html:
Código HTML:
<nav>
<div class="c_a">
<div class="c_aaoff">
<img src="http://www.forosdelweb.com/thumbnail/xxxxx/xxxx.jpg"/>
</div>
</div>
<div class="c_b">
<div class="c_bb">
<a href="xxx.html"><img src="http://www.forosdelweb.com/thumbnail/xxxxx/xxxx.jpg"/></a>
</div>
</div>
<div class="c_c">
<div class="c_cc">
<a href="xxx.html"><img src="http://www.forosdelweb.com/thumbnail/xxxxx/xxxx.jpg"/></a>
</div>
</div>
<div class="c_d">
<div class="c_dd">
<a href="xxx.html"><img src="http://www.forosdelweb.com/thumbnail/xxxxx/xxxx.jpg"/></a>
</div>
</div>
</nav> Código CSS:
Código HTML:
.c_a
{
width:144px;
height:80px;
background-image: url(../thumbnail/xxxxx/xxxx.jpg);
margin: 0px 0px 0px 0px;
position: relative;
}
.c_aa
{
width:144px;
height:80px;
-webkit-transition: opacity, 0s;
opacity:0;
}
div.c_a:hover div.c_aa
{
opacity: 1;
}
.c_b
{
width:144px;
height:80px;
background-image: url(../thumbnail/xxxxx/xxxx.jpg);
margin: -80px 0px 0px 152px;
position: relative;
}
.c_bb
{
width:144px;
height:80px;
-webkit-transition: opacity, 0s;
opacity:0;
}
div.c_b:hover div.c_bb
{
opacity: 1;
}
.c_c
{
width:144px;
height:80px;
background-image: url(../thumbnail/xxxxx/xxxx.jpg);
margin: -80px 0px 0px 304px;
position: relative;
}
.c_cc
{
width:144px;
height:80px;
-webkit-transition: opacity, 0s;
opacity:0;
}
div.c_c:hover div.c_cc
{
opacity: 1;
}
.c_d
{
width:144px;
height:80px;
background-image: url(../thumbnail/xxxxx/xxxx.jpg);
margin: -80px 0px 0px 456px;
position: relative;
}
.c_dd
{
width:144px;
height:80px;
-webkit-transition: opacity, 0s;
opacity:0;
}
div.c_d:hover div.c_dd
{
opacity: 1;
}
.c_e
{
width:144px;
height:80px;
background-image: url(../thumbnail/xxxxx/xxxx.jpg);
margin: 8px 0px 0px 0px;
position: relative;
}
¿Cómo hago para ajustar este menú que tengo?
Gracias!