Foros del Web » Creando para Internet » CSS »

Como Puedo hacer dimensiones de la web

Estas en el tema de Como Puedo hacer dimensiones de la web en el foro de CSS en Foros del Web. Buenas tengo un problema como hago para que mi web 800*600 se vea bien en 1440*900 y al contrario también, osea quiero que se vea ...
  #1 (permalink)  
Antiguo 31/01/2011, 07:48
 
Fecha de Ingreso: octubre-2009
Mensajes: 129
Antigüedad: 14 años, 5 meses
Puntos: 1
Exclamación Como Puedo hacer dimensiones de la web

Buenas tengo un problema como hago para que mi web 800*600 se vea bien en 1440*900 y al contrario también, osea quiero que se vea bien en todas las resoluciones y visto varias webs que pueden hacer eso, alguien me explica como ? es un script?
  #2 (permalink)  
Antiguo 31/01/2011, 08:19
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 9 meses
Puntos: 1012
Respuesta: Como Puedo hacer dimensiones de la web

en vez de usar unidades absolutas, usa unidades relativas
  #3 (permalink)  
Antiguo 31/01/2011, 09:08
Avatar de jomaruro
Colaborador
 
Fecha de Ingreso: junio-2002
Ubicación: Naboo
Mensajes: 5.442
Antigüedad: 21 años, 8 meses
Puntos: 361
Respuesta: Como Puedo hacer dimensiones de la web

Hola:

Sin ver tu código las respuestas son simples divagaciones pero prueba incluyendo toda tu página en un div contenedor con el ancho fijo que quieras y aplícale margin:0 auto.

IsaBelM, la solución que indicas generalmente no va a solucionar el problema.

Saludos.

  #4 (permalink)  
Antiguo 31/01/2011, 09:34
 
Fecha de Ingreso: octubre-2009
Mensajes: 129
Antigüedad: 14 años, 5 meses
Puntos: 1
Respuesta: Como Puedo hacer dimensiones de la web

Cita:
Iniciado por jomaruro Ver Mensaje
Hola:

Sin ver tu código las respuestas son simples divagaciones pero prueba incluyendo toda tu página en un div contenedor con el ancho fijo que quieras y aplícale margin:0 auto.

IsaBelM, la solución que indicas generalmente no va a solucionar el problema.

Saludos.

me podrías pasar algún link profa soy novato en este thema.
  #5 (permalink)  
Antiguo 31/01/2011, 09:38
Avatar de sanxuan  
Fecha de Ingreso: enero-2011
Ubicación: Gijón
Mensajes: 671
Antigüedad: 13 años, 2 meses
Puntos: 36
Respuesta: Como Puedo hacer dimensiones de la web

El utilizar un modelo de ancho fijo y centrarlo en la página es sólo una de las posibilidades existentes. Es muy utilizada porque evita tener que pensar, tener que probar y tener que saber para enfrentarse a las dificultades que en principio puedan causar otras configuraciones.
Para alguien que empieza, apoyo la idea de usar esa configuración, pero hay otras alternativas.
Se pueden usar medidas en em en lugar de en pixels o combinaciones de las dos unidades.
Se pueden usar tamaños proporcionales en lugar de fijos en algunos elementos.
Se pueden usar las propiedades min-height, min-width, max-height y max-width para evitar que las medidas proporcionales se salgan de madre, etc...
Todo eso se logra cambiando sólo el CSS.
Javascript será necesario donde no exista la posibilidad de usar CSS.
  #6 (permalink)  
Antiguo 31/01/2011, 16:37
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 9 meses
Puntos: 1012
Respuesta: Como Puedo hacer dimensiones de la web

Cita:
Iniciado por jomaruro Ver Mensaje
Hola:
IsaBelM, la solución que indicas generalmente no va a solucionar el problema.

Saludos.

puede que no haya comprendido lo que moises9633 explica. como tu dominas mucho mas que yo este campo, te dejo un ejemplo de a qué me refería con unidades relativas, para que me corrijas
Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="es" xml:lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin titulo</title>
<style type="text/css">
html, body {
height: 100%;
background-color: red;
margin: 0;
}

#cont {
background-color: yellow;
min-height: 100%;
height: auto !important;
height: 100%;
max-width: 95%;
margin: 0 auto -1em;
}

#cont2 {
background-color: green;
min-height: 100%;
height: auto !important;
height: 100%;
max-width: 95%;
margin: 0 auto -1em;
}
</style>
</head>
<body>
<div align="center">
<div id="cont">
bloque contenedor
<div id="cont2">
otro bloque
</div>
</div>
</div>
</body>
</html>
  #7 (permalink)  
Antiguo 31/01/2011, 18:55
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 16 años, 9 meses
Puntos: 539
Respuesta: Como Puedo hacer dimensiones de la web

IsaBelM
Según el doctype que declara (strict) no puede usar el <div align="center">
Y creo que ese css es una parte de un ejemplo de "pie abajo" y el resto de toda la altura ocupada por el contenedor (#cont) (sin el align), alque le falta el mini reset y el footer. Y de todas formas, no necesitaría el align, bastaría con declarar una posición a #cont distinta al valor por defecto (static)

moises9633:
Creo que debería definir qué entiende (o quiere lograr) con su expresión:
Cita:
que mi web 800*600 se vea bien en 1440*900 y al contrario también
porque caben varias interpretaciones.
  #8 (permalink)  
Antiguo 31/01/2011, 20:43
 
Fecha de Ingreso: octubre-2009
Mensajes: 129
Antigüedad: 14 años, 5 meses
Puntos: 1
Respuesta: Como Puedo hacer dimensiones de la web

Cita:
Iniciado por kseso? Ver Mensaje
IsaBelM
Según el doctype que declara (strict) no puede usar el <div align="center">
Y creo que ese css es una parte de un ejemplo de "pie abajo" y el resto de toda la altura ocupada por el contenedor (#cont) (sin el align), alque le falta el mini reset y el footer. Y de todas formas, no necesitaría el align, bastaría con declarar una posición a #cont distinta al valor por defecto (static)

moises9633:
Creo que debería definir qué entiende (o quiere lograr) con su expresión:
porque caben varias interpretaciones.
es que estoy diseñando una pag. en photoshop y quiero que se vea bien en todas las resoluciones
  #9 (permalink)  
Antiguo 01/02/2011, 06:36
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 9 meses
Puntos: 1012
Respuesta: Como Puedo hacer dimensiones de la web

Cita:
Iniciado por kseso? Ver Mensaje
Según el doctype que declara (strict) no puede usar el <div align="center">
no lo sabía, pero solo se trataba de centrar el texto de una manera rápida, sin usar otro selector
Cita:
Iniciado por kseso? Ver Mensaje
Y creo que ese css es una parte de un ejemplo de "pie abajo" y el resto de toda la altura ocupada por el contenedor (#cont) (sin el align),
yo no lo uso como footer únicamente, también lo uso como cuerpo. no es correcto??
Cita:
Iniciado por kseso? Ver Mensaje
alque le falta el mini reset y el footer. Y de todas formas, no necesitaría el align, bastaría con declarar una posición a #cont distinta al valor por defecto (static)
no sé que es el mini reset y has de pensar que es solo un ejemplo hecho al vuelo.
si fueras tan amable de responder a mi pregunta y explicarme que es un mini reset

gracias
  #10 (permalink)  
Antiguo 01/02/2011, 08:36
Avatar de ayukkonen  
Fecha de Ingreso: octubre-2010
Ubicación: Sevilla
Mensajes: 355
Antigüedad: 13 años, 5 meses
Puntos: 48
Respuesta: Como Puedo hacer dimensiones de la web

Inserta esto en tu hoja de estilos, y no lo modifiques.

* {
margin: 0px;
padding: 0px;
}

Un saludo.
  #11 (permalink)  
Antiguo 01/02/2011, 08:46
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 16 años, 9 meses
Puntos: 539
Respuesta: Como Puedo hacer dimensiones de la web

Cita:
Iniciado por moises9633 Ver Mensaje
es que estoy diseñando una pag. en photoshop y quiero que se vea bien en todas las resoluciones
Como le decía, debería explicar qué entiende por "verse bien". Y el trasladar un diseño gráfico a código (y multinavegador) no es algo "automático. Dependerá de cada diseño en particular.

Cita:
Iniciado por IsaBelM Ver Mensaje
no lo sabía, pero solo se trataba de centrar el texto <- para ello existe text-align de una manera rápida, sin usar otro selector
Cita:
Iniciado por IsaBelM Ver Mensaje
yo no lo uso como footer únicamente, también lo uso como cuerpo. no es correcto?? <-- No era mi intención calificarlo de correcto/apropiado o incorrecto/inapropiado
Cita:
Iniciado por IsaBelM Ver Mensaje
no sé que es el mini reset y has de pensar que es solo un ejemplo hecho al vuelo.
si fueras tan amable de responder a mi pregunta y explicarme que es un mini reset <-- Qué es el reset css? Lo de llamarlo mini reset es algo de mi cosecha. Sería algo así como: * {margin:0, padding:0; border: none;} Y suelo añadirle en cosas sencillas /position: relative/ pero siendo consciente de que eso rompe a ie6
De todas formas, es un tema muy tratado, y una búsqueda le arrojará los distintos css más utilizados
Cita:
Iniciado por IsaBelM Ver Mensaje
gracias<--no hay porqué
  #12 (permalink)  
Antiguo 01/02/2011, 17:06
Avatar de IsaBelM
Colaborador
 
Fecha de Ingreso: junio-2008
Mensajes: 5.032
Antigüedad: 15 años, 9 meses
Puntos: 1012
Respuesta: Como Puedo hacer dimensiones de la web

gracias ayukkonen y kseso? por responder.
Cita:
Iniciado por kseso? Ver Mensaje
<- para ello existe text-align
sí, que tonta. aun me falta mucho manejo
Cita:
Iniciado por kseso? Ver Mensaje
Sería algo así como: * {margin:0, padding:0; border: none;} Y suelo añadirle en cosas sencillas /position: relative/ pero siendo consciente de que eso rompe a ie6
he visto muchas veces el selector universal con esas propiedades, pero nunca las he usado, basicamente por que no comprendo para que se usan.
el código que expuse anteriormente ha quedado así. esto es lo que me comentabaís??
Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="es" xml:lang="es">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin titulo</title>
<style type="text/css">
* {
margin: 0;
padding: 0;
border: none;
position: relative;
}

html, body {
height: 100%;
background-color: red;
}

#cont {
background-color: yellow;
min-height: 100%;
height: auto !important;
height: 100%;
max-width: 95%;
margin: 0 auto -1em;
text-align: center;
}

#cont2 {
background-color: green;
min-height: 100%;
height: auto !important;
height: 100%;
max-width: 95%;
margin: 0 auto -1em;
text-align: center;
}
</style>
</head>
<body>
<div id="cont">
bloque contenedor
<div id="cont2">
otro bloque
</div>
</div>
</body>
</html>
  #13 (permalink)  
Antiguo 01/02/2011, 17:15
Avatar de daPhyre
Colaborador
 
Fecha de Ingreso: marzo-2008
Ubicación: [email protected] (Redirects to 127.0.0.1)
Mensajes: 2.404
Antigüedad: 16 años
Puntos: 142
Respuesta: Como Puedo hacer dimensiones de la web

Cita:
Iniciado por moises9633 Ver Mensaje
es que estoy diseñando una pag. en photoshop y quiero que se vea bien en todas las resoluciones
Lo mejor es, hacer el diseño al ancho máximo de la pantalla mínima (996px para una pantalla de 1024px de ancho), y centrarlo:

Código:
#container{max-width:996px;margin:0 auto}
Y como fondo, usar un color sólido o una imagen que pueda reproducirse como mosaico. Con eso, tu diseño no se verá mal, independiente del tamaño de la pantalla.
__________________
<signs>daPhyre</signs>
Jugaa.me


Adios al dolor de cabeza de IE...

Etiquetas: dimensiones
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 03:30.