Sunday 15 February 2015

javascript - How to Set Fixed-Position Element Height to Reach Bottom of Browser Window? -


I have a header on the top, a sidebar on the left, and there is a main content area on the right. A simplified version can be seen.

Styling in the sidebar is status: fixed so that it does not scroll with the rest of the page. It works but I also need a sidebar if its content is too long, to scroll.

This is possible only if I can set the right height for the sidebar. But I can not find any way to set this height. 100% is close, but it is too long because the sidebar starts below the header.

Is there no way to fix this? I'm open to either a CSS or Javascript / jQuery solution.

I think I will post it, because it starts working:

  div # header-div {height: 90px; Background color: lime; Margin: 0; } Div # Fixed-div {Status: fixed; Left: 0; Top: 0; / * & Lt; & Lt; & Lt; No offset * / bottom: 0; / * & Lt; & Lt; & Lt; Drag downwards for height * / Margin: 120px 0 0; / * & Lt; & Lt; & Lt; Give it 120px top * / width: 260px; Background color: silver; Overflow-y: scroll up; }   



No comments:

Post a Comment