@elaineleung
Posted
Hi Amya, for the footer, if I were to do it I'm most likely use grid-template-areas. Also, in desktop view I can see that part of your content is overflowing off to the side for certain breakpoints, and the content is cut off. Are you using some sort of container class on each section so that the widths are the same? I do see that the other sections seem to be having the same widths but not the footer, but in the original design it looks like it should. Try something like this:
<main>
<section>
<div class="container"> {section content here} </div>
</section>
<section>
<div class="container"> {section content here} </div>
</section>
</main>
<footer>
<div class="container"> {section content here} </div>
</footer>
That way, the footer and the rest of the sections would have the same styling for the widths.
I also suggest checking out Kevin Powell's YouTube channel as he recently did a tutorial series using one of the challenges on Frontend Mentor, and the layout is similar to this one. Good luck!
Marked as helpful
