[SOLVED] Make main content and sidebar divs of equal height.
I have used flexbox in my page. The page contains 4 sections: 1. Header 2. Main Content 3. Sidebar 4. Footer I have arranged them in the page using flexbox. Header occupies 100% width, main content + Sidebar = 100% and footer = 100%. Everything is ok right here. My requirement is I need the equal height of section and aside contents, that is also there. But what I actually want is the height of Sidebar should be equal to the height of main div. This is still confusing point. Example: here in this code, it keeps blank space at the bottom to make both divs of equal height. But it should consider the height of <section> and apply the same height to the sidebar also. If the height of Sidebar goes longer than .main content, the sidebar should be vertically scrollable. So, to make the code work in all situations, I am dynamically adding some content to both divs in certain time interval. So, it should be updating the height when the content is added or removed. https://code.sololearn.com/W07Ml6zTxZUi/?ref=app
Often have questions like this?
Learn more efficiently, for free:
