Consulta Css y xhtml, div height = 100%

Si eres usuario
Ingresa aquí »

¿Eres nuevo?

psicofxp.com

Google ?

Google
Artículos
Foros
Fotos
Videos
Amigos

Estás en: Inicio / Foros / Informática / Webmasters / Desarrollo Web

Desarrollo Web » Consulta Css y xhtml, div height = 100%
Participa en el tema Consulta Css y xhtml, div height = 100% en el foro Desarrollo Web. Hola foreros, vengo con una duda q si bien hay info en san google, no ...

0votos

LinkBack

Herramientas

Buscar en este tema

franch47

Monito

#1 | 02.03.2009, 23:55 hs.

Consulta Css y xhtml, div height = 100%

Hola foreros, vengo con una duda q si bien hay info en san google, no lo pude solucionar, estoy haciendo un site y quiero que para las distintas resoluciones de los usuarios el div contenido tenga un height de 100%, aunque falte contenido. Tambien me gustaria saber sus opiniones sobre lo que pienso hacer (lo del contenido, ya q me gustaria q para todas las resoluciones el footer este abajo de todo) y sobre el sitio en general .El sitio en cuestion es este. tambien dejo el codigo:
Xhtml:

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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Haras La Misericordia - Inicio</title>
<link href="estilos.css" rel="stylesheet" type="text/css" />
</head>

<body>
<div id="headwrapper">
  <div id="header"></div>
</div>

<div id="contenido">
  <div id="imagen"><img src="elementos_activos/imagenes/harasimagen.jpg" alt="Haras Los campeones" />     </div>
  <div id="colizq">
    <h1><font face="Arial, Helvetica, sans-serif">Bienvenido</font></h1>
    <p>texto.</p><br>
    <p>› texto.
    <p>› texto.    
    <p>› texto</div>
  
  <div id="colder">
    <h2>Servicos</h2>
    <p>texto</p>
    <img src="elementos_activos/imagenes/harasthumbs.jpg" alt="Caballos" width="330" height="79" align="absbottom" class="thumbs" /></div>
    <div class="clearfooter"></div> 
    <div id="footer">copyright© 2009 haraslamisericordia.com.ar All rights reserved. Xhtml - Css
    <div id="diseno">Diseño web: Concept Dezain</div>
  </div>  
</div>
</body>
</html>

Y el CSS:

Código:

@charset "utf-8";
/* CSS Document */

* {
	margin: 0; padding: 0; 
}

html {
	width: 100%;
}body {
    width: 100%;
	background-image: url(elementos_activos/imagenes/bodyfondo.jpg);
	background-repeat: repeat;
}
#headwrapper {
	height: 251px;
	width: 100%;
	background-image: url(elementos_activos/imagenes/harasheadfondo.jpg);
	background-repeat: repeat-x;
	background-position: center center;
}
#header {
	height: 251px;
	width: 700px;
	margin-right: auto;
	margin-left: auto;
	background-image: url(elementos_activos/imagenes/harashead.jpg);
	background-repeat: no-repeat;
	background-position: center center;
}
#contenido {
	width: 700px;
	height: 100%;
	min-height: 100%;
	margin-right: auto;
	margin-left: auto;
	background-color: #F3EDE5;
	background-image: url(elementos_activos/imagenes/harasfondofooter.jpg);
	background-repeat: no-repeat;
	background-position: center bottom;
	position:relative; 
	margin-bottom: -30px;
}
#contenido #imagen {
	height: 191px;
	width: 700px;
}

#colizq {
	height: 225px;
	width: 330px;
	margin-left: 10px;
	float: left;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #787571;
	background-image: url(elementos_activos/imagenes/harashdivisor.jpg);
	background-repeat: no-repeat;
	background-position: center 20px;
}
#colder {
	float: right;
	height: 225px;
	width: 330px;
	margin-right: 10px;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 11px;
	color: #787571;
	background-image: url(elementos_activos/imagenes/harashdivisor.jpg);
	background-repeat: no-repeat;
	background-position: center 20px;
}
#footer {
	height: 60px;
	width: 680px;
	border-top-width: 1px;
	border-top-style: dotted;
	border-top-color: #666666;
	margin-right: auto;
	margin-left: auto;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 10px;
	color: #666666;
	position: relative;
}
#diseno {
	width: 140px;
	position: absolute;
	left: 540px;
	top: 2px;
}
.thumbs {
	margin-top: 10px;
}

h1 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	font-style: normal;
	color: #666666;
	text-decoration: none;
	text-align: right;
	margin-bottom: 10px;
}
h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: 13px;
	color: #666666;
	text-decoration: none;
	text-align: left;
	margin-bottom: 10px;
}
.clearfooter {
	height: 10px;
	clear: both;
}

franch47

Monito

#2 | 07.03.2009, 16:23 hs.

Re: Consulta Css y xhtml, div height = 100%

perdon q reviva pero todavia no encontre ninguna informacion, alguien?

Bueno encontre la solucion, lo dejo por si le sirve a alguien. Es ponerle height 100% tanto al body como al html

Editado por franch47 - 08.03.2009 18:38 hs.. Motivo: Encontre la solucion

Loon

Master Wizard

#3 | 15.06.2009, 15:26 hs.

Re: Consulta Css y xhtml, div height = 100%

te falta asignarle 100% height al BODY.

Desarrollo Web» Consulta Css y xhtml, div height = 100%

« Tema anterior | Siguiente tema »

Herramientas	Buscar en este tema
Versión para imprimir Enviar por correo	Buscar en este tema: Búsqueda avanzada
Califica este tema
Califica este tema:

Este tema está relacionado con otros ya publicados en el sitio. Podés visitarlos ahora!
Tema	Iniciado por	Foro	Resp.	Último mensaje
Consulta - Placa - TV - Monitor - VHS	ediego	Hardware	5	26.06.2007 21:54 hs.
Consulta XHTML Strict	matcod86	Desarrollo Web	2	15.09.2006 10:44 hs.
!!consulta!!	PoetaCamba	Software	10	16.01.2004 21:54 hs.
consulta sobre Partition magic	Camus	Software	4	22.03.2002 02:58 hs.
consulta	PoetaCamba	Preguntas y sugerencias sobre psicofxp.com	7	14.03.2002 21:16 hs.