Hola a todos:
Tengo una lista y quiero que aparezca en cada lista una imagen distinta de 70px x 70px y a su lado 4 textos y quede centrado en altura
Y cuando hago el hover, q cambie el fondo del <li>
Algo como en la imagen q adjunto, pero no doy que quede bien
Alguna idea
el style es:
<style>
ul.masve {}
li.masve {
list-style-type: none;
float: left;
width:250px;
border: 1px solid #444;
}
li.masve a {
text-decoration: none;
display: block;
text-align: left;
background: #cdcdcd;
padding: 10px 0;
}
li.masve :hover {
text-decoration: none;
display: block;
text-align: left;
background: #cdcdcd;
padding: 10px 0;
}
li.masve a img {
display: block;
margin: 0 auto;
max-width: 70px;
}
</style>
y lo llamo en html :
Código:
<ul class="masve">
<li><a href="url" title="">
<img class="ex2" src="images/55/19.jpg" height="70" width="70" alt="" />
Texto1 <br />Texto2 <br />Texto3 <br />Texto4 </a>
</li>
<li><a href="url" title="">
<img class="ex2" src="images/55/20.jpg" height="70" width="70" alt="" />
Texto1 <br />Texto2 <br />Texto3 <br />Texto4 </a>
</li>
<li><a href="url" title="">
<img class="ex2" src="images/55/21.jpg" height="70" width="70" alt="" />
Texto1 <br />Texto2 <br />Texto3 <br />Texto4 </a>
</li>
</ul>