Foros del Web » Creando para Internet » CSS »

Css adaptado a la resolución

Estas en el tema de Css adaptado a la resolución en el foro de CSS en Foros del Web. Hola a todos, Necesito diseñar una serie de capas de forma relativa y con porcentajes para que se adapte a cualquier resolución superior o igual ...
  #1 (permalink)  
Antiguo 30/03/2011, 03:15
 
Fecha de Ingreso: noviembre-2005
Ubicación: Alicante (España)
Mensajes: 242
Antigüedad: 12 años
Puntos: 1
Css adaptado a la resolución

Hola a todos,

Necesito diseñar una serie de capas de forma relativa y con porcentajes para que se adapte a cualquier resolución superior o igual a 1024x768.
(Para 800x600 ya lo tengo implementado con capas fijas y, para menores resoluciones que esta, envío un mensajito que dice: “Tío, deshazte ya del 386 ése y ponte un ordenador en condiciones!!... Ah ¿Qué estás conectándote desde un móvil?... Bueno.. .pues me has pillao… Atento a nuevas versiones…” ;)

El caso es el siguiente.

4 capas, (porque lo quiero hacer con capas).
Situadas sobre una capa contenedora de 100% de ancho y 100 de alto. Para esta capa, creo que debería usar un tipo #contenedor {width:100%;height:100%;}
Las 4 capas deben situarse de forma alineada a la izquierda, (para ello float:left).

.capa_left1{float:left}
.capa_left2{float:left}
.capa_left3{float:left}
.capa_left4{float:left}

Y ahora el problema que no sé resolver.

Las capas 1 y 3, tienen un tamaño fijo de 245px de ancho x 100% alto. Este tamaño de 245 pixeles es porque contienen una imagen.
Las capas 2 y 4 han de tener el mismo ancho pero no ser estático, es decir, dependerá de la resolución de la pantalla. Así que tendría que ponerle un %, pero ¿cuál?

#contenedor{ width:100%;height:100%;}

.capa_left1{ width:245px;height:100%;float:left}
.capa_left2{ width:X%;height:100%;float:left}
.capa_left3{ width:245px;height:100%;float:left}
.capa_left4{ width:X%;height:100%;float:left}

¿Cómo defino el css de estas 4 capas más el contenedor?

Estoy poniendo colorines a cada capa con la propiedad background-color pero no termina de ajustarse bien a lo que quiero en diferentes resoluciones.

Saludos,

Etiquetas: resolución, adaptador
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 17:48.