html - Making a sidebar always 100% height -


i've designed website can see below, has fixed header (white), sub-header, main content, sidebar (red) , footer (grey).

i have created wireframe website in html/css, can't sidebar work properly.

i sidebar start on sub-header , go way bottom of page end after footer (see image below) no matter how content there in main section, can't work.

please help! here current efforts on jsfiddle, can see sidebar doesn't go bottom of page: http://goo.gl/eq7cjh

remove position: relative content div , use margin-top position panel, shown:

#content {     height: 100%; } #sidebar {     border: 1px solid skyblue;     width: 100px;     position: absolute;     margin-top:7em;     top: 0px;     right:0px;     bottom: 0px; } 

updated jsfddle


Comments

Popular posts from this blog

javascript - RequestAnimationFrame not working when exiting fullscreen switching space on Safari -

Python ctypes access violation with const pointer arguments -