The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS 100% height – What am I doing wrong ??

  • This topic is empty.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • #32836


    I’m new to HTML and CSS and I would need your help, I tried a lot of things already !

    My HTML is validated (same as the CSS so I’ll only post CSS code):

    #container {
    width: 960px;
    margin: 0px auto;
    background: #333;
    overflow: auto;

    .container_left {
    float: left;
    width: 650px;
    background: transparent;

    .container_right {
    float: right;
    width: 300px;
    background: transparent;
    border-left: 1px solid #000;
    height: 100%;

    What I am trying to do is to have the left border of the .container_right stretching to the bottom of the #container. The problem is that #container height cannot be applied (Yeah, I know that it would solve my problem.) because I want to have #container and #container_left stretchable, depending on the content which user enters (in the .container_left).

    Please help !


    Welcome to floats, they are taken out of inline flow which means the #container box does not read the height of any floated elements within, only inline elements.
    This might help you:


    @abochman #container stretches successfully with “overflow: auto”, depending on the content entered in .container_left, but the problem is that I cannot make .container_right to stretch (depending on .container_left content) to the bottom of the #container.

Viewing 3 posts - 1 through 3 (of 3 total)
  • The forum ‘CSS’ is closed to new topics and replies.