Home/ Questions/Q 8372951
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-06-09T14:33:38+00:00

I am trying to create sidebar. Well, the design is supposed to be 3

  • 0

I am trying to create sidebar. Well, the design is supposed to be 3 divs. Header (Which is already done), Sidebar, and the main div.

The sidebar is intended to be on the left side on the screen, extending all the way down to the bottom (height:100%). The problem I am stuck at is that I am not able to make a 100% Div as its height only extends to the number of lines of text I have in the div.

Here is the CSS for the sidebar that I currently have:

#sidebar {
    float: left;
    margin-top:36px;
    width: 300px;
    height:100%;
    background-color: #111211;
}

Here is the CSS code for the body that I currently have:

body {
    margin:0;
    padding:0px;
    background-color:#87AFC7;
}

Here is the HTML code:

<body>
  <div id="sidebar"> left-sidebar </div>
</body>
Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    You need to set the height of the parent of the sidebar to 100%, and in turn the parent of that. Since the sidebar is an immediate child of the body element, just add this to your CSS:

    html,body { height:100%; }
    • 0