centrar o no una web de acuerdo a la resolución de pantalla

arielcasanova · #1 (**permalink**) 18/02/2010, 05:27

Gente: tengo un problema con este sitio:
www.macagnosa.com
En mi monitor de 17" widescreen, se ve centrado, muy lindo (en 1024 de ancho), pero en el de mi cliente, uno de 14" cuadrado, me queda mal (800 px de ancho), porque no se ve entero el sitio, entonces queda un espacio a la izquierda de 200 px que es lo que hace de margen en mi monitor... ¿alguien sabe qué puedo hacer para que se vea centrado siempre, en cualquier resolución de monitor?

GRACIAS.

maycolalvarez · #2 (**permalink**) 18/02/2010, 07:29

si buscas es el tema más común del foro CSS, no existe una solución eficaz, todo depende del alcance del proyecto y de la época, los monitores de 14" tuvieron su auge, actualmente la mayoría tiene de 17" para arriba y ahora el auge de los widescreen.

si el sistema es una web pública, debes dejarlo como esta, una web para 1024 es la tendencia actual, en cuanto a tu cliente, debe de entender que para los usuarios es lo mejor, da paso al progreso y no hacia atrás, además, independientemente de la resolución del monitor, lo importante es que la web funcione debidamente para los usuarios.

salvador86 · #3 (**permalink**) 18/02/2010, 08:40

He visto tu web y creo que te puede servir lo siguiente.

Este ejemplo es para centrar tanto horizontalmente como verticalmente

Código PHP:

  .contenedor{ 
    position:absolute; 
    left:50%; 
    top:50%; 
    width:748px; 
    height:376px; 
    margin-left:-374px; 
    margin-top:-188px; 
    overflow:auto; 
}

arielcasanova · #4 (**permalink**) 18/02/2010, 09:43

Maycol, gracias por tus consideraciones, yo pienso igual, pero mi cliente es bastatne mayor y piensa que todos deben tener monitores como el de él; mi idea era dejarlo conforme, sin perjudicar la publicación para el resto del mundo.

Salvador, he probado pero no me da resultado; por ahora la dejo centrada a la izquierda para todo el mundo... ya veremos si encuentro otra slución.

Gracias ambos

beep · #5 (**permalink**) 19/02/2010, 08:00

Yo he hecho una cosa con la mia y puede que sea una burrada.
Primero creo una tabla y le doy la propiedad Aling=”center”.
Dentro de la tabla inserto el css.
No se si me explico bien.

Impostor · #6 (**permalink**) 19/02/2010, 08:09

Cita:

Iniciado por beep

Yo he hecho una cosa con la mia y puede que sea una burrada.
Primero creo una tabla y le doy la propiedad Aling=”center”.
Dentro de la tabla inserto el css.
No se si me explico bien.

Pues si que es un poco burrada. Las tablas son para tabular datos, no para maquetar, y ademas ese "center" no válida.

Saludos¡¡

arielcasanova · #7 (**permalink**) 19/02/2010, 08:10

Beep: gracias por la idea.
No creo que sea una burrada, simplemente, deja de lado los estándares para css, pero si funciona, a quién le importa?
en unvrato lo pruebo.
saludos,

jomaruro · #8 (**permalink**) 19/02/2010, 08:27

Hola:

Cita:

Iniciado por arielcasanova

No creo que sea una burrada, simplemente, deja de lado los estándares para css, pero si funciona, a quién le importa?

¿A Google, por ejemplo?

Saludos.

arielcasanova · #9 (**permalink**) 19/02/2010, 08:28

Jomaruro, la verdad es que no uso para nada tablas, por esto de los estándares, pero no sabía que afectaba a google. ¿tienes idea de qué forma?

beep · #10 (**permalink**) 19/02/2010, 13:43

Yo me refiero:

</head>

<body>
<table width="940" border="0" align="center">
<tr>

<td><div id="cabecera"></div>(por ejemplo) 

</td>
</tr>
</table>

</body>
</html>

Y así sucesivamente ir introduciendo todo entre los </table> ya me imagino que va contar los estandares. Pero esque soy algo novato y esta es la solución que se me ocurrió , hasta saber como hacerlo bien.

daPhyre · #11 (**permalink**) 19/02/2010, 15:09

Espera... ¿¡USAS UN TEXT-ALIGN PARA CENTRAR!?

(¿O para qué es? Pues está en el body y veo que nada está centrado por defecto)

Estoy viendo tu CSS y está lleno de contradicciones (¿O serán hacks? :S)

El punto es que no veo que uses un margin:0 auto en el contenedor. Eso debería hacer que la página esté siempre centrada, y si la resolución es menor, se alinie totalmente a la izquierda. ¿Eso es lo que buscas?

Por ahora, yo no lo veo centrado y tengo una pantalla de 1366px de ancho. Saludos.

pitufoweb · #12 (**permalink**) 19/02/2010, 15:45

tan solo con un margin: 0 auto y un ancho en el contenedor es suficiente para que quede centrada en cualquier resolución. Pero como dice daPhyre; tienes muchos conflictos en tu css. primero tendrias que arreglar eso.

daPhyre
El text-align: center se usa para que el margin:o auto funcione con IE 5.

Saludos

daPhyre · #13 (**permalink**) 19/02/2010, 16:32

Cita:

Iniciado por pitufoweb

daPhyre
El text-align: center se usa para que el margin:o auto funcione con IE 5.

<broma>¿IE5? Como que me suena el nombre, pero no logro identificarlo...</broma>

¿¡Aún hay gente que le da soporte a este navegador!?

pitufoweb · #14 (**permalink**) 19/02/2010, 17:00

creo que hay algunos dinosaurios navegando por Internet :D

Saludos.

nombredeusuario2 · #15 (**permalink**) 21/02/2010, 13:21

Crea 2 sitios web para ambas resoluciones y introduce js codigo para que puedas detectar el monitor (o resolución).
De más está decir que tu cliente tiene razón: si el tiene un monitor 14'' muchos lo tendrán y en consecuencia no podrán ver su sitio correctamente. Lo que tu cliente te pide es que se vea bien en TODOS los monitores que existen. Y así debe ser (yo soy diseñador de sitios webs a veces, y tengo clientes muy exigentes).
Saludos