Design comparison
Solution retrospective
I'm just starting out and would like some feedback on how I can better my syntax, clean it up, and any other tips.
I'm still figuring out where to use vw vs % vs rem vs more fixed units like px.
Thanks for checking out my effort.
Community feedback
- @mattstuddertPosted almost 5 years ago
Great work on this challenge, Sonia! Rafael has already given some great advice.
With regards to CSS units, I typically use
rem
for properties likefont-size
,padding
andmargin
. This allows you to simply re-declare thefont-size
on thehtml
element and the sizes will change proportionally.I very rarely use
vw
, as it only looks at the viewport. This means you can get some unexpected sizing issues where child elements overflow their parent on the x-axis. Instead, I'll typically use%
. Or if I'm using Flexbox,flex-grow
and with Grid I'll commonly usefr
units.I hope that helps. Let me know if you have any questions!
2 - @rafaelmaiachPosted almost 5 years ago
Hey, congrats on your solution!
As some feedback I can give:
-
Prefer IDs/classes to style your elements instead of inline styling. Inline styling can be very hard to read when you need to use a lot of styling.
-
You could check some different resolutions when resizing the browser to check some layout broking gaps.
1 -
- @screaminghaikuPosted almost 5 years ago
Thanks so much for the feedback. We just learned about implementing bootstrap and refactoring work. Looking forward to implementing this advice with it.
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