So at

http://www.prestongreenhouse.com I am trying to get the right sidebar to stretch to 100%. prior to my efforts it was just a little box only as tall as the business hours, it stopped just after last line with 5:00pm.

I found the stickied thread out there and I am able to get the html and body tags to go to 100%, then set the min height of that sidebar to 100%. What is puzzling me is, why is it so tall? It seems to be over 100%

Any thoughts?

height and width apply to the content area . Padding, borders and margins are then added to the values to make the overall element dimensions.

http://www.modtalk.co.uk/_site/code/.../three-column/

Presenting The W3c Box Model

I am familiar with that but dont see any reason why the padding or margins would cause that area to be that long

.thrColFixHdr #sidebar2 (line 55)
{
float: right;
width: 200px;
background-color: #9ca06a;
background-image: none;
background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 0%;
background-clip: border-box;
background-origin: padding-box;
background-size: auto auto;
color: #ffffff;
margin-top: 5px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
min-height: 100%;
}

It's 100% of the screen height. If you scroll down a bit so that the upper border of the area is at the top of the screen, it exactly covers the whole height of the screen.

now that makes a LOT of sense I more want the sidebar on the right to be 100% of the height of the main content area in the middle so that it is always as long as that. Guess I might have to rearrange my divs so that the is a child of the main content. that however may have unintended consequences...

thoughts?

Originally Posted by scuts

Guess I might have to rearrange my divs so that the is a child of the main content. that however may have unintended consequences...

How would it create unintended consequences when that's what you want?

So I went back and made the sidebar part of the maincontent. Set maincontent's height to 100% and then set the sidebars min height to 100% and it produced the same result. The sidebar was 100% of the page, not the container.

Any ideas on what I am doing wrong? I have set the sidebar back to a manual height for now, but that is the only change in the css.

I have been messing with this and messing with this and still can not get it right. I now have the issue on another sight as well.

I do not want the height of the site/page to be 100% of the window, more 100% of its parent.

so if I have

body
  main container
    inner left container
    inner right container  (want this container to be 100% of inner left)
  end main
end body

the right container is nested inside of the left

You will have to use javascript (i must rewite that someday soon) or Faux Columns.