Foros del Web » Creando para Internet » CSS »

Problema descuadre divs

Estas en el tema de Problema descuadre divs en el foro de CSS en Foros del Web. Hola, tengo un esquema muy simple pero no funciona bien y, por mucho que lo intento, no consigo arreglarlo. Al visualizar el código en firefox, ...
  #1 (permalink)  
Antiguo 03/05/2011, 09:53
gat
 
Fecha de Ingreso: mayo-2004
Mensajes: 29
Antigüedad: 13 años, 7 meses
Puntos: 0
Problema descuadre divs

Hola, tengo un esquema muy simple pero no funciona bien y, por mucho que lo intento, no consigo arreglarlo.
Al visualizar el código en firefox, los div RIGHTHEADER y REGISTRY salen debajo del logo en vez de a su derecha y el CONTENT aparece también con una altura muy pequeña.
Alguien es capaz de detectar el fallo o hacerme las correcciones que vea? es que es mi primer diseño y estoy un poco perdido.
GRACIAS (cualquier consejo será bien recibido)

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=UTF-8">
<title>Untitled Document</title>
<link href="layout.css" rel="stylesheet" type="text/css">
<link href="style.css" rel="stylesheet" type="text/css">
</head><body>



<div id="container">

	<div id="header">
		<div id="logo"><img src="images/logo_bonardi_varona.png"></div>
    	<div id="rightheader">rightheader</div>
        <div id="registry">registry</div>
        
	</div>
    
    <div id="content">
		<div id="left">content</div>
	</div>
    
    <div id="breadcrumbs">breadcrumbs</div>
    
	<div id="footer">
    	<div id="address">address</div>
        <div id="edigital">edigital</div>
	</div>
        
</div>




</body></html> 
Código:
@charset "UTF-8";

* {margin:0; padding:0;}
/* reset styles */
html, body, h1, h2, h3, h4, h5, h6, p, ol, ul, li, pre, code, address, variable, form, fieldset, blockquote {
 padding: 0;
 margin: 0;
 font-size: 100%;
 font-weight: normal;
}
/* end reset styles */


body {background: url(images/bg_BonardiVarona.png) repeat-x}

	<!--left: 50%;
	margin-left: -100px /*hay que restar la mitad del ancho*/-->
	
#container {
	width: 925px;	
	height: 550px;
	margin: 0% auto auto auto;
	border:1px solid black;
}

#header {
	position: relative;
	width: 900px;
	height: 140px;
	margin: 0% auto auto auto;
	border: 1px solid black;
	overflow: hidden;
}

	#logo {	
		position: relative;
		width: 218px;
		height: 110px;	
		padding: 5px 0px 0px 0px;
		border: 1px solid black;
		float: left;
	}

	#rightheader {
		position: relative;
		width: 500px;
		height: 118px;
		padding: 5px 0px 0px 0px;
		border: 1px solid black;
		float: right;
		background: #F00;
					
		
	}
	
	#registry {		
		position: absolute;
		width: 10em;
		height: auto;
		padding: 5px;
		border: 1px solid black;
		background: #F00;
		right: 5%;
	}


#content {
	
	width: 900px;
	height: 350px;
	border: 1px solid black;
	background: #9F3;
	margin: auto;
	overflow: hidden;
}

#footer {
	margin: auto;
	width: 900px;
	height: 50px;
	border: 1px solid black;
}

	#address {
		float: left;
		margin: 0px;
		height: auto;
		padding: 5px 0px 0px 0px;
		float: left;
		background-color: #09F;
	}
	#edigital {
		float: right;
		height: auto;
		padding: 5px 0px 0px 0px;
		background-color: #09F;
	}

#breadcrumbs {
	position: absolute;
	width: 200px;
	height: auto;
	padding: 5px 0px 0px 0px;
	border: 1px solid black;
	background-color: #09F;
	left: 50%;
	margin-left: -100px /*hay que restar la mitad del ancho*/
	}
  #2 (permalink)  
Antiguo 03/05/2011, 11:26
Avatar de ZoroRoronoa  
Fecha de Ingreso: marzo-2011
Ubicación: California, USA
Mensajes: 823
Antigüedad: 6 años, 8 meses
Puntos: 116
Respuesta: Problema descuadre divs

agregas px, em, %, etc...
le das posiciones relativas y flotas uno a la derecha, otro a la izquierda y REGISTRY no lo flotas y le das una posicion absoluta.

salen con altura pequeña porque unno tiene una altura AUTO y otro la tiene de 118px.

De buena manera te recomendaria que pases por http://librosweb.es porque tienes muchos errores, o al menos no estas maquetando bien las cosas.

Saludos
__________________
Programador jQuery & PHP
  #3 (permalink)  
Antiguo 05/05/2011, 03:58
gat
 
Fecha de Ingreso: mayo-2004
Mensajes: 29
Antigüedad: 13 años, 7 meses
Puntos: 0
Respuesta: Problema descuadre divs

Gracias por tu respuesta. Ya estoy liado con el link que me has dado y he resuelto casi todo.

Etiquetas: divs
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

SíEste tema le ha gustado a 1 personas




La zona horaria es GMT -6. Ahora son las 00:56.