Page is not taking full size of div

Question

I'm making a dashboard page for posting articles for my website. i have a sidebar and a section where my posting page will appear but that page is not taking up the full size of section... here is the screenshot of my problem https://ibb.co/kuZBQm

 .container { width: 100%; height: auto; } aside { float: left; width: 200px; height: 500px; border: 1px solid; } section { width: 100%; height: 500px; border: 1px solid red; } 

 <div class=" container"> <aside> <a href="#" onclick="load_topgamespost()"><button> Top Games</button></a> </aside> <section id="section"></section> </div> <script> function load_topgamespost() { document.getElementById("section").innerHTML = '<object type="text/html" data="/topgames/topgamespost"></object>'; } </script> 

Answer 1

So your section is the correct size, the problem is with the object element inside it.

Use

section object{
    width:100%;
    height:100%;
}

Answer 2

body{
height: 100vh;
padding: 0;
margin: 0;
}

try this style in your body tag i think this suits in your problem