Need help with CSS positioning

I need help with positioning the two containers so they are aligned with the nav and footer sections. Here are the HTML and CSS code: https://codepen.io/Sampsa96/pen/jOWeVva

Comments

[lolleri200]

Ended up fixing the issue modifying the #Page in CSS like this:

page {

width: 1080px;
margin-top: 0px;
margin-bottom: 0px;
margin-left: auto;
margin-right: auto;
background-color: #D8CCAF;
}

[Ricardo Sanchez]

Hi,

I think you are trying to aling both divs to the left, if that is the case then:

Try making the content div a display grid, like so

display: grid;
grid-template-columns: 1fr;

and add the footer as a child to the content div should do the trick.

But you may need to keep adjusting as you build along, hope that helps.

[lolleri200]

So where exactly I add these grids? Can you give an example?

[Ricardo Sanchez]

You have a div with an id of content correct. Well just add the css code I mention to that div, hope that makes sense.

[Erkand Imeri]

Use flexbox man, you have tons of examples how to do this kind of layouting.