Design comparison
Community feedback
- @bccpadgePosted about 1 month ago
Hello @MatheusPolletti. Congratulations on completing this challenge!!!🎉
I have a few suggestions to improve your solution.
Update your code to this
body > .container { /* margin-top: 10%; */ /*margin-bottom: 10%; */ background-color: hsl(0, 0%, 12%); border-radius: 2%; /* width: 30vw; */ padding: 1rem; }
- Add
min-height: 100vh;
on thebody
than the.container
andpadding: 1rem
; - I commented the CSS properties that you don't need using
/* This is a comment*/
The media query below is unnecessary because on mobile devices your code is too small and social media links are outside the card.
To remove the scrollbar, add
margin: 0;
on thebody
@media (max-width: 764px) { body > .container { margin-top: -50%; width: 85vw; height: 55vh; } }
I hope you find this useful and don't hesitate to reach out if you have any questions
Marked as helpful1@MatheusPollettiPosted about 1 month ago@bccpadge Thanks for the corrections, they'll absolutely help me in the future. I really appreciate it
0 - Add
- @Axsel519Posted about 1 month ago
good work but you need use max-height
0@MatheusPollettiPosted about 1 month ago@Axsel519Thanks for the tip, but could you explain more, if possible?
0@Axsel519Posted about 1 month ago@MatheusPolletti
Because the height was exaggerated, the max-height will ensure that it does not exceed the required height. @MohamedHagag120@Axsel519Posted about 1 month ago@MohamedHagag12 Now it works fine At first it wasn't good
0@Axsel519Posted about 1 month ago@MohamedHagag12 I don't know but the rise was exaggerated Well the important thing is that it works now
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