@Suleman-Tasawar
Posted
Hi there Alessio i viewed the issue of your website.By loading it in mobile device i noticed that everything is stretching in mobile version.
If you think 🤔 about the layout of this project and break it into smaller components.
For the Navigation we can use flex box for it For the Main hero section we can use grid like you did.
As in your code your have only used grid-template-column
has have given 3 columns.But you did specify how many row you need and i think that is causing the content stretching in your website.
You can use grid-template-row:repeat(2,1fr);
This will give you 2 rows to put you elements in
(The repeat is just a shorthand for grid-template-row:1 fr 1 fr;
by repeating it two time)
and as for the footer you can also use flexbox as the elements need to be placed horizontally