Cita:
Iniciado por warywin No consigo poner las imagenes bien adaptadas a la pantalla como el de la pagina que puse:
Código CSS:
Ver original.main .work{
display: block;
max-width: 262px;
max-height: 262px;
float: left;
position: relative;
overflow: hidden;
}
.main .work .media {
width: 100%;
height: 100%;
vertical-align: middle;
}
lo he cambiado por el max-width y max-height al tamaño real de las imagenes pero cuando encoges la ventana del navegador y dependiendo del tamaño de la pantalla hay margenes en blanco. Mi conclusion es que tendria que ser con porcentajes pero perderia resolucion como me pasaba antes, que si que se adaptaban bien pero llegaban a ser mas anchas a veces que las propias fotos originales.
Te diría que a través de las
@media
-queries vayas aumentando un poco más el tamaño de las imágenes en aquellas dimensiones donde haya márgenes en blanco (imagino que son espacios vacíos porque por default tienes un BG=White).