En realidad son dos imagenes, la caratula del juego y una transparencia que he hecho con la plantilla de la caja de Ps3.
Ahora el problema:
Lo que pasa es que juego con relative y absolute para hacer eso, al principio tuve problemas por que cuadre la transparencia en mi portatil y cuando lo veias en otro ordenador con otra resolucion, quedaba descuadrada, solucioné eso metiendo la transparencia dentro del div de la caratula pero para ello tuve que darle un top: -225px; y ahora el problema es que me queda un hueco debajo de las caratulas como si estubiese alli la transparencia pero en realidad la he subido con el top.
y no se que hacer para solucionarlo. Os dejo el codigo css y php para ver que me recomendais. Mil gracias de antemano y un saludo.
CSS
Código PHP:
/* Sobreponer columna izq videojuegos */
.contenido .columna_izquierda .superponer{
background-image: url(../img/zona_game/fondo.jpg);
background-repeat: repeat-y;
background-position: left top;
/*padding: 10px;*/
text-align: center;
border-left-width: thin;
border-left-style: solid;
border-left-color: #222222;
padding-top: 20px;
}
.contenido .columna_izquierda .texto{
text-align: center;
position: relative;
top: -244px;
}
.contenido .sobreponer img{
left: 3px;
top: -225px;
overflow: hidden;
height: 244px;
}
.contenido .columna_izquierda .superponer img{
position: relative;
PHP
Código PHP:
<div class="superponer"><h3>ZONA GAME</H3></div>
<div class="superponer"><img src="http://portadas.videoclubmadison.com/videojuegos/'.$registro['portada'].'" width="160" height="208"/>
<div class="sobreponer"><a href="'.$web.'videojuegos/'.$registro['alias'].'.html"><img src="'.$web.'img/'.$brillo.'" width="200" height="255" alt="portada del videojuego '.utf8_encode($registro['titulo']).' (estreno en videoclub)"/></a><br />
<div class="texto">FECHA DE ESTRENO</br><h3><font size="3">'.$fecha.'</H3></font></div>
</div>
</div>
;
Os lo agradereia en el alma estoy empezando por favor criticarme o lo que sea pero ayudenme jajajaj
un saludoooooo.