no me respeta la altura de un div

engonga · #1 (**permalink**) 12/02/2009, 02:53

hola tengo una estructura asi

Código PHP:

  <div id="container" align="center">
<div id="capcalera">hola caracola
</div>
<div id="cos">
<div id="menu">
</div>
<div id="contingut">
</div>
</div>
<div id="peu">
</div>
</div>

</div>

pero el menu y el contingut

les pongo esto

Código PHP:

  #container #cos #menu {
 font-family: "Times New Roman", Times, serif;
 padding: 3px;
 float: left;
 width: 200px;
 margin-top: 2px;
 margin-right: 5px;
 margin-bottom: 2px;
 margin-left: 2px;
 border: 1px solid #CCCCCC;
 height:100%;
 clear: none;
}
#container #cos #contingut {
 font-family: "Times New Roman", Times, serif;
 font-family: "Times New Roman", Times, serif;
 padding: 3px;
 float: right;
 width: 650px;
 margin-top: 2px;
 margin-right: 5px;
 margin-bottom: 2px;
 margin-left: 2px;
 border: 1px solid #CCCCCC;
 height:100%;
 clear: none;
}

y me sobresalen osea no se hacen lo alto de #cos

emiliodeg · #2 (**permalink**) 12/02/2009, 05:57

fijate q #cos tenga un alto o que no tenga padding
sino la mas facil es hacer #cos relativo y a menu y cotingut absolutos
saludos

engonga · #3 (**permalink**) 12/02/2009, 07:25

basolutos es poniendo un punto delante no?

y el relativo como se hace?

engonga · #4 (**permalink**) 12/02/2009, 13:06

lo he provado todo y mas o menos me funciona

pero ahora si en la capa Menu es mas alta se sobre pone

Código PHP:

  <body>
<div id="container" align="center">
<div id="capcalera">hola caracola
</div>
<div id="cos">
<div id="menu" class="menu">
  <p>menu menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>&nbsp;</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menumenu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
</div>
<div id="contingut" class="contingut">adsfasdfads</div>
</div>
<div id="peu">
</div>
</div>

</div>
</body>

css

Código PHP:

  body {
  
  font-size: 12px;
  font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
  
  padding:0px;
  margin:0px;
}
#container {
 width: 900px;
 margin-top: 0px;
 margin-right: auto;
 margin-bottom: 0px;
 margin-left: auto;
 
}
#container #capcalera {
 font-family: "Times New Roman", Times, serif;
 height:100px;
 border:1px solid #006600;
 margin-bottom:5px;
 
}
#container #cos{
 
 font-family: "Times New Roman", Times, serif;
 height:500px;
 border:1px solid #006600;
 padding:5px;
 overflow:visible;
 
 
}
#container #peu {
 font-family: "Times New Roman", Times, serif;
 height:45px;
 border:1px solid #006600;
 margin-top:5px;
 
 background-color: #CEFFCE;
}
#container #cos #menu {
 
 font-family: "Times New Roman", Times, serif;
 
 float: left;
 width: 20%;
 
 margin-top: 2px;
 
 margin-bottom: 2px;
 margin-left: 2px;
 border: 1px solid #CCCCCC;
 overflow: auto
 
}
#container #cos #contingut {
 
 font-family: "Times New Roman", Times, serif;
 
 float: right;
 width: 79%;
 margin-top: 2px;
 margin-right: 2px;
 margin-bottom: 2px;
 margin-left: 2px;
 border: 1px solid #CCCCCC;
 overflow: auto;
}

talmente · #5 (**permalink**) 12/02/2009, 13:44

Hola, prueba esto, me he tomado la livertad de hacer algunos combios (minimos) para que te funcione, los colores de fondo solo son para identificar cada cosa.

Código:

body {
	font-size: 12px;
	font-family: Verdana, Arial, SunSans-Regular, Sans-Serif;
	padding:0px;
	margin:0px 2%;
}
#container {
	width: 100%;
	margin-top: 0px;
	margin-right: auto;
	margin-bottom: 0px;
	margin-left: auto; 
}
#container #capcalera {
 font-family: "Times New Roman", Times, serif;
 height:100px;
 border:1px solid #006600;
 margin-bottom:5px;
 
}
#container #cos{
	font-family: "Times New Roman", Times, serif;
	border:1px solid #006600;
	background: #3366FF;
	float: left;
	display: block;
	width: 100%;
}
#container #peu {
	font-family: "Times New Roman", Times, serif;
	height:45px;
	border:1px solid #006600;
	margin-top:5px;
	background-color: #CEFFCE;
	clear: both;
}
#container #cos #menu {
	font-family: "Times New Roman", Times, serif;
	float: left;
	width: 20%;
	border: 1px solid #CCCCCC;
	background: #993300;
}
#container #cos #contingut {
	font-family: "Times New Roman", Times, serif;
	float: right;
	width: 79%;
	margin-top: 2px;
	margin-right: 2px;
	margin-bottom: 2px;
	margin-left: 2px;
	border: 1px solid #CCCCCC;
	overflow: auto;
	background: #00CC99;
}

Código:

<div id="container" align="center">
<div id="capcalera">hola caracola
</div>
<div id="cos">
<div id="menu" class="menu">
  <p>menu menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>&nbsp;</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menumenu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>menu menu</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
</div>
<div id="contingut" class="contingut">
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>&nbsp;</p>
  <p>adsfasdfads</p>
</div>
</div>
<div id="peu">
</div>
</div>

engonga · #6 (**permalink**) 12/02/2009, 14:15

lo pruebo y te digo