I need a bit of help here because I can't figure out where I made a mistake. Whatever the mistake is is preventing CSS grids fr
Here is the code: <!DOCTYPE HTML> <html> <head> <!--Use CSS Grids to style this page--> <title>Home Page</title> <div align="center" class="header"><h1>Website Portal</h1></div> <style> .header { background-color: #FF0000; border: 3px solid black; margin: 2px; padding: 2px; /*Remember you can put CSS styling in another file*/ /*This styles the head of the page*/ } .menu_area { height: 300px; width: 250px; background-color: #FF0000; border: 3px solid black; margin: 2px; padding: 2px; grid-area: -webkit-menu; /*This styles all content within the menu grid area, which is left*/ } .topic { text-decoration: underline; font-weight: bold; /*This styles the text at the top of each box*/ } .main_area { height: 300px; width: 250px; background-color: #FF0000; border: 3px solid black; margin: 2px; padding: 2px; grid-area: -webkit-main; } </style> <body class="body"> <article class="menu_area"> <h2 align="center" class="topic">Social Media</h2><br /> <ul align="left" class="ulist"> <li><a href="https://www.facebook.com/" class="link" target="_blank">Facebook</a></li><br /> <li><a href="https://www.instagram.com/" class="link" target="_blank">Instagram</a></li><br /> <li><a href="https://www.pinterest.com/" class="link" target="_blank">Pinterest</a></li><br /> </ul> </article> <article class="main_area"> <h2 align="center" class="topic">Banking</h2><br /> <ul align="left" class="ulist"> <li><a href="https://www.onlinebanking.pnc.com/alservlet/PNCOnlineBankingServletLogin" class="link" target="_blank">PNC</a></li><br /> </ul> </article> </body> <footer class="footer"> </footer> </html>