Using grid to lay out a website, avoiding potential use of dvh
Hi, so I have really two questions that go hand in hand.
See, I am new in this whole "using grids to lay out" sites thing. I have seen a lot of people simply add those grid elements to the body tag itself, which honestly was pretty eye-opening, although messing with the body tag like that is a little daunting, but there doesn't seem to be an issue with it?
The reason I'm asking this is because I was doing an assignment from The Odin Project and placed a div container inside of the body to create the grid layout. However, when zooming out, the bottom of the page would simply end without rendering, like in the attachment. Once I asked how I could solve it since 100vh didn't seem to work in the server for the course, someone simply added a 100dvh to the div containing the grid, which worked. However, I know that, while the dynamic viewport units are supported in all major browsers, they're still relatively new and could not be the best fit for compatibility or the likes. And thus, I am wondering two things:
- Would it be better to just outright turn the body into the grid to avoid using dvh units?
- If not, what's the best way to make the website fit properly?
See, I am new in this whole "using grids to lay out" sites thing. I have seen a lot of people simply add those grid elements to the body tag itself, which honestly was pretty eye-opening, although messing with the body tag like that is a little daunting, but there doesn't seem to be an issue with it?
The reason I'm asking this is because I was doing an assignment from The Odin Project and placed a div container inside of the body to create the grid layout. However, when zooming out, the bottom of the page would simply end without rendering, like in the attachment. Once I asked how I could solve it since 100vh didn't seem to work in the server for the course, someone simply added a 100dvh to the div containing the grid, which worked. However, I know that, while the dynamic viewport units are supported in all major browsers, they're still relatively new and could not be the best fit for compatibility or the likes. And thus, I am wondering two things:
- Would it be better to just outright turn the body into the grid to avoid using dvh units?
- If not, what's the best way to make the website fit properly?
