Comunidad de diseño web y desarrollo en internet online

Ayuda!! Web centrada en cualquier resolución

Citar            
MensajeEscrito el 08 Nov 2010 09:54 pm
Hola buenas, podiais decirme como es para tener tu Web centrada en cualquier resolución, manejo el Dreamweaver CS4 y CS2, pero no consigo que quede centrada tanto en mi pantalla de 19" como en la de 23".

Sabeis como??

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox
Citar            
MensajeEscrito el 09 Nov 2010 09:09 am
Prueba a crear un div contenedor con por ejemplo, 80% de anchura y luego dale un margen de lo que quieras de altura, pero auto de ancho. Prueba y comentame!

Por charliechin

19 de clabLevel



 

chrome
Citar            
MensajeEscrito el 09 Nov 2010 01:20 pm
Hola, gracias por responder, te comento, este es el código que yo he puesto y la capa contenedor sale centrada en ambas pantallas 19" y 23", pero no se como ir creando la Web dentro de ese contenedor, por que toda las capas o layers que creo para las diferentes partes de la Web se quedan fuera del susodicho contenedor y logicamente no queda centrado....Este es el código:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Centrado</title>
<style>
#centrada { margin: 0px auto;
width: 600px;
background-color: rgb(51, 153, 153);
height: 400px;
}
</style>
</head>
<body>
<div id="centrada">Esta caja deber&iacute;a estar centrada</div>
</body>
</html>

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox
Citar            
MensajeEscrito el 09 Nov 2010 03:19 pm
No uses dimensiones fijas, sino porcentajes como te han dicho.

Código HTML :

width: 80%;

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 09 Nov 2010 08:38 pm
oK, lo pongo en porcentajes pero como mantengo la Web dentro del contenedor y teniendo en cuenta que la hago en Layers, aunque no se si tiene diferencia con las tablas a la hora de centrarla para todas las resoluciones.

Y otra pregunta más, para que la vertical de la Web no tenga tmaño fijo, tendría que darle un - auto - en html o sería con CSS?

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox
Citar            
MensajeEscrito el 10 Nov 2010 09:34 am
Prueba con esto:

Código HTML :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="es-es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Centrado</title>
<style>
body{background:#EFF1F0;}
#centrada {
   color:#FFF;
   border:1px solid #E78226;
   background:#BD4A2D;
   width:80%;
   margin:0 auto;
   text-align:center;
}
.header{
   margin:0 auto;
   border:1px solid  #BB8058;
   background:#BEC2C1;
   width:90%;

   }
</style>
</head>
<body>
<div id="centrada">
   <div class="header">Cabecera</div>
    <p>En esta capa va todo el contenido, si quieres anidar más capas hazlo tal y como está en el código.</p>

</div>
</body>
</html>

Por charliechin

19 de clabLevel



 

chrome
Citar            
MensajeEscrito el 10 Nov 2010 10:56 am
Con el código que me dejas puedo llegar a centrar la cabecera pero como mueva el porcentaje de - centrada - se mueve toda la cabecera, así que lo dejo en el 80% al igual que el - header - en su 90%, hasta aquí todo bien pero el problema de siempre es que no consigo mantener la web que voy haciendo dentro de la capa que me indicas que va todo el contenido, se ve distinto en ambas pantallas. Yo en diseño hago un -Div PA - y luego trato de contenerlo en la capa de tu código pero no hay forma, no tengo ni idea de cómo hacer el código para que quede dentro y centrada la web, bueno te comento como es la web por si hubiese que hacerlo de otra forma:
La Web es de 900px de ancho, el alto no importa porque cojera bastante hacia abajo, así que no sería cerrada la vertical de la web. Aquí tenemos la cabecera, justo debajo un botonera del mismo ancho y debajo comienza el contenido que está dividido en 3 columnas, a la izquierda y a la derecha 15capas o layers una debajo de otra de 100px por 100px cada una para publicidad y en el centro donde se desarrollan las secciones de la web y que tendrá de ancho 700px, no sé si la estructura de la web tiene que ver para centrarla de una forma u otra.

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox
Citar            
MensajeEscrito el 16 Nov 2010 04:52 pm
Bueno gente muchas gracias por tratar de ayudarme, al final he resuelto el problema....Ya casi tengo la Web terminada, aunque creo el cliente quiere añadir una pequeña Base de Datos para muestra de productos y creo que con eso ya la termino.

Gracias.

Por CLAnonimo

Claber

600 de clabLevel

5 tutoriales
1 articulo

 

Este es un usuario anónimo genérico para las cuentas borradas o perdidas.

firefox
Citar            
MensajeEscrito el 11 Mar 2013 10:06 am
Hola:

Genial el post, me ha servido de guía¡¡¡

pero tengo una duda: como hago para que el tamaño de los textos, fuentes, imágenes, guarden una proporción adecuada.

por ejemplo, si lo pongo de esta manera: font-size:10px no siempre guarda una relación con un div que esta en porcentanje, no?

Un saludo

Por miriamgomez

1 de clabLevel



 

chrome
Citar            
MensajeEscrito el 11 Mar 2013 12:54 pm
Para las fuentes usa la media em. Un 1em vale proporcionalmente al tamaño estandar de la tipografía para la resolución actual.

Por DriverOp

Claber

2510 de clabLevel



 

opera
Citar            
MensajeEscrito el 11 Mar 2013 06:39 pm
Hola:

Lo primero es agradecerte tu respuesta, pero soy muy torpe...

A ver, significa que si yo fijo el font-size: 1,0 em, ese tamaño sera el mismo, en proporcion, sea cual sea la resolucion de la pantalla?

Un saludo

Por miriamgomez

1 de clabLevel



 

msie
Citar            
MensajeEscrito el 11 Mar 2013 08:41 pm
Así es.

Por DriverOp

Claber

2510 de clabLevel



 

opera

 

Cristalab BabyBlue v4 + V4 © 2011 Cristalab
Powered by ClabEngines v4, HTML5, love and ponies.