Gracias por contestar,
Si le pongo una posición absoluta desaparece el icono, y si le pongo una posición relativa no surge ningún cambio. Que puedo hacer ?
Trate de ponerle un margen pero aun asi el div se desplaza hacia abajo, aca dejo la estructura:
Código HTML:
<div id="mss" class="col">
<div class="imagen"></div>
<div class="col-cnt">
<h2>TITULO</h2>
<p>texto...</p>
<a href="#" class="more">ver mas</a>
</div>
</div>
y el css es este:
Código:
.main .cols { padding-left: 32px; padding-right: 32px; }
.main .cols h2 { padding-bottom: 4px; text-align: center; }
.main .cols #mss { width: 238px; height: 250px; float: left; box-shadow: 0 0 15px rgba(0,0,0,.28); -webkit-box-shadow: 0 0 15px rgba(0,0,0,.28); -moz-box-shadow: 0 0 15px rgba(0,0,0,.28); margin-left: 20px; padding: 20px; }
.main .cols .col { display: block; margin: 0 auto; width: 73px; height: 74px; margin-top: 8px; margin-bottom: 14px; }
.main .cols .col .imagen { margin-left: 60px; height: 112px; background: url(images/service-ico1.png) no-repeat; position: relative; }
.main .cols .col .imagen:hover { height: 121px; background: url(images/service-ico1h.png) no-repeat; transition: 1s; }