Design comparison
Solution retrospective
This is my 2nd attempt. I try to fix all previous problem as much as possible. this is only for desktop view. mobile view is quite difficult for me. because i am not an expert. I learning day by day.
Community feedback
- @ChrisesbuenoPosted about 2 years ago
As advice, I would tell you that in the body you do not add an exact width, normally it is not necessary in most cases since as default it always uses the 100vw available from the browser, and the size that you really want to be able to modify is that of your container, yes you still want to add a width to your body use the following style min-width: 100vw. To center the elements in your body with grid you only need to use two lines, display: grid; place-items: center;
For the mobile view part, you only need to add a single column template to your grid because it is the only thing you need, and accommodate the different parts of your code in the part where it would go, it is a bit more complicated to understand but not difficult, I leave you this game that explains how grid works in a didactic and interactive way: https://cssgridgarden.com/ :D
Marked as helpful0@rasel9t6Posted about 2 years ago@Chrisesbueno Thanks For Your valuable advice. Its helps me lot.
0
Please log in to post a comment
Log in with GitHubJoin our Discord community
Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!
Join our Discord