¿Cómo establecer la misma altura en los DIV internos? [duplicar]

Posible duplicado:
¿Maximizar un div flotante?

Tengo este código HTML:

    <div id="container">


        <div id="sidebar">

            left
            <br /><br /><br /><br /><br /><br />
        </div>

        <div id="content">
            right
            <br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
            bla bla
        </div>

        <div class="clear"></div>

    </div>  

y este es el código CSS:

#container {
    width: 760px;

    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;   

    overflow: hidden;
    background: #ffffff;
    border: 1px solid #cdcdcd;      
}

#sidebar {
    float:left;
    width:25%;
    background:#555;
}

#content {
    float:left;
    width:75%;
    background:#eee;
}


.clear {
  clear: both;
}

desafortunadamente, la barra lateral no tiene la misma altura que cointaner, ¿cómo puedo extender su altura?

Muchas Gracias

preguntado el 03 de mayo de 12 a las 18:05

3 Respuestas

Puede que no sea exactamente lo que estás buscando, pero prueba esto:

<style>
#container {
    width: 760px;

    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;   

    overflow: hidden;
    background: #ffffff;
    border: 1px solid #cdcdcd;      
    position: relative; //Makes the children in the container positionable
}

#sidebar {
  bottom: 0px; //position side bar.
  left: 0px; //position side bar.
  top: 0px; //position side bar.
  width:25%;
  background:#555;
  position: absolute
}

#content {
  margin-left: 25%;
  width:75%;
  background:#eee;
}


.clear {
  clear: both;
}
</style>
  <div id="container">


        <div id="sidebar">

            left
            <br /><br /><br /><br /><br /><br />
        </div>

        <div id="content">
            right
            <br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
            bla bla
        </div>

        <div class="clear"></div>

    </div>  

contestado el 03 de mayo de 12 a las 19:05

Puede establecer el color de fondo de su elemento contenedor en el mismo color de fondo que la barra lateral. De esa manera al menos vea como la barra lateral se extiende hasta el fondo.

Si necesita la barra lateral para realmente extienda todo el camino hacia abajo, creo que la forma más fácil de hacerlo sería usar una tabla. Puede haber una manera de hacer esto usando CSS, pero he buscado mucho y no he encontrado la manera.

contestado el 03 de mayo de 12 a las 18:05

Tu tienes mas <br/> en tu #contenido y luego en tu barra lateral. Entonces, todo el #contenedor pasa por la altura del elemento div máximo dentro del cual está el #contenido, es por eso que la #barra lateral parece más pequeña. O poner la misma cantidad de <br/> en la #barra lateral o romve el <br/>'s de ambos divs y establecerlos a ambos sus alturas, por ejemplo

#sidebar{

height:100;

}

#content{

height:100;

}

contestado el 03 de mayo de 12 a las 18:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.