@huyphan2210
Posted
Hi, @Nostromito,
I reviewed your solution and have a few suggestions:
- On my 1920 x 1080 screen, the
body
doesn’t cover the entire viewport. To address this, you can usemin-height: 100vh
on the body. This ensures that the body always extends to at least the full height of the viewport, preventing it from being shorter than the screen height. - After applying
min-height: 100vh
, you can center the content within the body using CSS Grid. Setdisplay: grid
on the body and useplace-items: center
to center the content both horizontally and vertically. This approach simplifies centering and ensures that the content remains in the middle of the viewport. You can then remove themargin-top: 3%
from theheader
, as the content will already be centered.
Hope this helps!
Marked as helpful
@Nostromito
Posted
@huyphan2210 That answers a lot of questions. Thank you very much!