Foros del Web » Creando para Internet » CSS »

Alto al 100% ( problemas )

Estas en el tema de Alto al 100% ( problemas ) en el foro de CSS en Foros del Web. Hola a todos, les comento que estoy con el siguiente problema: estoy empezando a armar un sitio con CSS y tengo el famoso problema del ...
  #1 (permalink)  
Antiguo 26/10/2006, 08:22
Avatar de m_sassa  
Fecha de Ingreso: noviembre-2002
Ubicación: Rio Cuarto - Córdoba - Argentina
Mensajes: 299
Antigüedad: 15 años
Puntos: 0
Alto al 100% ( problemas )

Hola a todos, les comento que estoy con el siguiente problema: estoy empezando a armar un sitio con CSS y tengo el famoso problema del alto, que no logro que me ocupe el 100%. O sea me ocupa el 100% de la pantalla pero cuando hago scroll para abajo, el fondo no continua. Coloco a continuacion el css:

Código:
html, body {
	height:100%;	
	margin: 0px;
}

#master {
	height:100%;
	width:100%;
	background:#FFFFFF url(../img/background.jpg);
}
#contenedor{
	position:relative;
	top:0px;
	width:772px;
	height:100%;
	background:#FFFFFF url(../img/background_content.jpg) repeat-y;
	margin:0 auto;
}
el html resumido:

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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Documento sin t&iacute;tulo</title>
<link href="css/styles.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="master">
  <div id="contenedor">
        //-- CONTENIDO --//
  <div id="contenedor">
<div id="master"> 
y una imagen, para que vean el problema:



gracias a todos....

PD: me olvide de agregar que esta vista es el Firefox, en IE se ve mejor, pero de todas formas no llega abajo de todo ( queda menos espacio en blanco, pero queda )
__________________
"El paisano es la persona que lleva el paisaje en el alma"
Atahualpa Yupanqui

Última edición por m_sassa; 26/10/2006 a las 08:38
  #2 (permalink)  
Antiguo 26/10/2006, 10:07
Avatar de CREW  
Fecha de Ingreso: diciembre-2004
Ubicación: Mi Casa
Mensajes: 793
Antigüedad: 13 años
Puntos: 0
Ola m sassa, te cuento que he tratado de lidiar con este mismo problema desde hace 2 semana, y tampoco he tenido mucha solución...

No se porque, pero resulta que si le borras las 2 primeras lineas del Codigo que te general la pagina:

Estas:
<!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">


si se te adapta al 100%, en cuanto al ALTO...

No se si sea una solución adecuada (por los estandares o algo asi), pero el caso es que a mi me resulto, pero por si acaso llegas a dar con la solución, creo que al igual que yo, muchos te estariamos agradecido...

Saludos!!!
__________________
_________________________________
Mario Contreras || Diseñador Gráfico + Web:Mi Blog
  #3 (permalink)  
Antiguo 26/10/2006, 10:27
Avatar de m_sassa  
Fecha de Ingreso: noviembre-2002
Ubicación: Rio Cuarto - Córdoba - Argentina
Mensajes: 299
Antigüedad: 15 años
Puntos: 0
pues no, probe borrando las 2 primeras lineas y tampoco, incluso borrando eso me cambio el tamaño de las fuentes de todo el sitio...

algun alma caritativa que nos de una mano...

gracias...
__________________
"El paisano es la persona que lleva el paisaje en el alma"
Atahualpa Yupanqui
  #4 (permalink)  
Antiguo 26/10/2006, 15:41
Avatar de praetor2004  
Fecha de Ingreso: julio-2004
Ubicación: Bogotá - Colombia
Mensajes: 90
Antigüedad: 13 años, 4 meses
Puntos: 0
CREW
No tengo una ayuda para este problema, pero borrando los DOCTYPE, lo unico que conseguirás es que tus páginas no validen, y que algunos buscadores no le den un buen reconocimiento, aparte que puede haber otras cosas que no salgan como vos esperas.
__________________
Leonardo Enrique Báez R.
Designs and IT - www.designsandit.com

Web Design – Valid Standards Websites
  #5 (permalink)  
Antiguo 26/10/2006, 16:03
Avatar de opeth  
Fecha de Ingreso: junio-2004
Ubicación: Distrito Federal, México
Mensajes: 338
Antigüedad: 13 años, 5 meses
Puntos: 0
tampoco tengo una solución pero el problema al no incluir el Doctype

Cita:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
es que activas el Quirks Mode

Saludos
__________________
Mi blog
  #6 (permalink)  
Antiguo 26/10/2006, 18:17
Avatar de m_sassa  
Fecha de Ingreso: noviembre-2002
Ubicación: Rio Cuarto - Córdoba - Argentina
Mensajes: 299
Antigüedad: 15 años
Puntos: 0
y pero debe haber una solucion CSS para esto... ademas de ser algo basico. Que por supuesto, yo no sé. jeje

Si alguien me puede ayudar a solucionar esto, o a hacerlo correctamente si es que esta mal implementado.

GRACIAS
__________________
"El paisano es la persona que lleva el paisaje en el alma"
Atahualpa Yupanqui
  #7 (permalink)  
Antiguo 26/10/2006, 18:34
Avatar de opeth  
Fecha de Ingreso: junio-2004
Ubicación: Distrito Federal, México
Mensajes: 338
Antigüedad: 13 años, 5 meses
Puntos: 0
Cita:
#master {
height:100%;
width:100%;
background:#FFFFFF url(../img/background.jpg);
}
que pasa si pones el background que tienes en #contenedor en #master ¿baja hasta el final de la página?

Cita:
#contenedor{
position:relative;
top:0px;
width:772px;
height:100%;
background:#FFFFFF url(../img/background_content.jpg) repeat-y;
margin:0 auto;
}
¿porque pones position:relative y top 0; en #contenedor?
__________________
Mi blog
  #8 (permalink)  
Antiguo 26/10/2006, 19:47
Avatar de marce_str  
Fecha de Ingreso: septiembre-2006
Ubicación: La Plata, Argentina
Mensajes: 203
Antigüedad: 11 años, 2 meses
Puntos: 1
a mi me paso unas cuantas veces eso y lo que hago es crear un identificador que "estira" el contenedor hacia abajo... el tema es no se si justo te servira a ti, creo que depende de la cantidad de información de la pagina.
O sea... si tenes tanta info que tenes que scrolear seguro te sirve, si tenes menos info no se si funciona.

Código:
#estira {
	height:10px;
	clear:right;
}
Despues justo antes de cerrar el contenendor pone este div

Código HTML:
<html>
<body>
<div id="contenedor">

<!--TODO EL CONTENIDO DE TU PAGINA-->


<div id="estira"></div>
</div>
</body>
</html> 

Con lo que te dijeron de poner el contenedor como background en el body, tene cuidado, yo lo hice y en se ve distinto entre los navegadores. A mi por lo menos me paso eso.

Saludos!
  #9 (permalink)  
Antiguo 27/10/2006, 10:01
Avatar de m_sassa  
Fecha de Ingreso: noviembre-2002
Ubicación: Rio Cuarto - Córdoba - Argentina
Mensajes: 299
Antigüedad: 15 años
Puntos: 0
ok, el background no lo puedo poner en el body, porque si la resolucion cambia, o no tengo la pantalla maximizada, no se centra la imagen, por eso es que la puse dentro del contenedor

voy a seguir probando, y escuchando ideas..

gracias
__________________
"El paisano es la persona que lleva el paisaje en el alma"
Atahualpa Yupanqui
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 20:41.