Foros del Web » Creando para Internet » CSS »

solucion para resoluciones

Estas en el tema de solucion para resoluciones en el foro de CSS en Foros del Web. hola amigos estoy diseñando una pagina y a la hora de situar los elementos,( cajas) como cada pagina del sitio tiene variaciones, he decidido hacer ...
  #1 (permalink)  
Antiguo 01/10/2009, 08:02
 
Fecha de Ingreso: agosto-2008
Mensajes: 606
Antigüedad: 15 años, 7 meses
Puntos: 11
solucion para resoluciones

hola amigos estoy diseñando una pagina y a la hora de situar los elementos,( cajas)
como cada pagina del sitio tiene variaciones, he decidido hacer posiciones absolutas.

Eso puede afectar a la visualizacion segun la resolucion que el usuario tenga en su pantalla.

como puedo establecer una resolucion para que se vean los elementos con la misma distribucion.
  #2 (permalink)  
Antiguo 01/10/2009, 17:35
 
Fecha de Ingreso: mayo-2009
Ubicación: Fuerteventura
Mensajes: 324
Antigüedad: 14 años, 10 meses
Puntos: 19
Respuesta: solucion para resoluciones

Hola, lo de las posiciones absolutas para todo lo veo un poco radical. Para controlar un poco la visualización independientemente de la resolución del usuario puedes englobar todo el contenido en un contenedor con un ancho fijo para 1024 (960px por ejemplo), o a los elementos que ya tienes darles medidas relativas (porcentajes o em) para que se adapten a la resolución en la que se muestren. Más fácil la primera opción.

Salud!
  #3 (permalink)  
Antiguo 01/10/2009, 23:36
Avatar de bex
bex
Colaborador
 
Fecha de Ingreso: julio-2003
Ubicación: Buenos Aires
Mensajes: 2.484
Antigüedad: 20 años, 8 meses
Puntos: 34
Respuesta: solucion para resoluciones

Alberto sin duda está en lo correcto. Una vez creado el contenedor podés usar posiciones absolutas para cajas dentro del mismo, siempre que tenga la propiedad position declarada. De ser así, las cajas toman su origen en la esquina superior izquierda del elemento que los contiene, en este caso el div contenedor.

De esta forma se puede, por ejemplo, centrar el contenedor mediante margin: 0 auto y después usar divs con position: absolut dentro del mismo. Si la resolución cambia, las cajas se centran junto con el contenedor.

Se entiende?
  #4 (permalink)  
Antiguo 02/10/2009, 02:51
 
Fecha de Ingreso: agosto-2008
Mensajes: 606
Antigüedad: 15 años, 7 meses
Puntos: 11
Respuesta: solucion para resoluciones

Mi problema es que todas las paginas del sitio no son iguales entonces como yo quiero utilizar un css para todas cuando doy una posicion, si en una pagina hay alguna caja que no hay en otra entonces varian las posiciones. lo otro que se me ocurre es situar todas las cajas comunes a todas las hojas en primera posicion del html una detras de otra y asi las particulares añadiendolas detras. ¿ es buena solución?

muchas gracias alberto grcia y a ti bex.
  #5 (permalink)  
Antiguo 02/10/2009, 04:37
 
Fecha de Ingreso: mayo-2009
Ubicación: Fuerteventura
Mensajes: 324
Antigüedad: 14 años, 10 meses
Puntos: 19
Respuesta: solucion para resoluciones

Hola de nuevo, es importante en un sitio por motivos de accesibilidad guardar una consistencia en el diseño de la estructura. Pero si necesitas hacerlo como dices y usar una sola hoja css, puedes darle al body de cada página un id y en el css usar la especifidad para dar estilo a los mismo elemento pero en páginas distintas. Más o menos así:

Código:
<body id="inicio">
<div id="contenedor">
...contenido...
</div>
</body>
Y en el css te refieres al div contenedor especificando un elemento padre del mismo:

Código:
#inicio #contenedor {width: 80%;}
#contacto #contenedor {width: 60%;}
Todo esto si te he entendido bien, claro.

Por otro lado, cuando empieces un sitio es bueno hacer todo este tipo de consideraciones respecto del diseño de la estructura de la información al principio del proyecto, luego te ahorras mucho tiempo haciendo parches y chapuzas en el código porque te has dado cuenta de que algo no funciona como esperabas cuando ya lo tienes casi todo armado. Puede que te de pereza hacerlo para este que tienes entre manos pero para el próximo investiga los wireframes.

Salud!
  #6 (permalink)  
Antiguo 02/10/2009, 10:00
 
Fecha de Ingreso: agosto-2008
Mensajes: 606
Antigüedad: 15 años, 7 meses
Puntos: 11
Respuesta: solucion para resoluciones

Graias alberto garcia, buen consejo creo que es lo primero que me tengo que plantear la estrctura de la inforrmacion en la pagina y luego decidir que medidas generales tomar. como sueles hacerlo con un dibujito en un folio o tienes alguna herramienta. Pudes adjuntar un ejemplo en el hilo. gracias.
  #7 (permalink)  
Antiguo 02/10/2009, 10:27
 
Fecha de Ingreso: mayo-2009
Ubicación: Fuerteventura
Mensajes: 324
Antigüedad: 14 años, 10 meses
Puntos: 19
Respuesta: solucion para resoluciones

En este sitio tienes mi ejemplos de wireframes, yo personalmente uso lapiz y papel cuadriculado, pero puedes usar un programa de edición cualquiera, como Fireworks o Gimp.

Ahora mismo no te puedo adjuntar ninguno pues tendría que escanearlo pero no son muy diferentes de los del enlace.

Salud!
  #8 (permalink)  
Antiguo 02/10/2009, 10:27
 
Fecha de Ingreso: mayo-2009
Ubicación: Fuerteventura
Mensajes: 324
Antigüedad: 14 años, 10 meses
Puntos: 19
Respuesta: solucion para resoluciones

/* algo ha ocurrido y he posteado el mismo mensaje dos veces. Borro el contenido de este */

Última edición por AlbertoGarcia; 02/10/2009 a las 10:29 Razón: Post duplicado
  #9 (permalink)  
Antiguo 02/10/2009, 13:03
Avatar de bex
bex
Colaborador
 
Fecha de Ingreso: julio-2003
Ubicación: Buenos Aires
Mensajes: 2.484
Antigüedad: 20 años, 8 meses
Puntos: 34
Respuesta: solucion para resoluciones

Yo lo suelo hacer en Photoshop o Illustrator (dependiendo el aspecto que quiera conseguir) y ya incluyo el diseño.
Saludos!
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 22:17.