Landing Page Project - CSS Grid - Can't get the main section to display correctly

HTML-CSS
1

Hi,

I’m trying to create the landing page project.
In my main section I want it to display as follows:

grid-template-areas:
“. intro .”
“service video-div”
“. form .”;

However, it is currently displaying like this.

Could someone please advise how to correctly set up the grid area? This is my first time experimenting with CSS grid to create layouts.

Thanks

2

You can try this:

grid-template-areas:
"intro intro intro"
"service video-div video-div"
"form form form";

And see if this is what you wanted.