@bentekku
Submitted
@bentekku
@bentekku
Submitted
@bentekku
Posted
Don't mind the screenshot taken by FrontendMentor, the real design is not off-looking.
@mreed4
Submitted
Without a Figma file to reference, how did you determine border-radius
, padding
, etc.?
@bentekku
Posted
Hey Matthew, nice work. Your design looks identical to the challenge.
As for the community question you asked, the answer would be, eye-balling the correct border-radius
and padding
.
Use chrome dev tools to tweak the css in the browser itself to save time and frustration switching back and forth between the code editor and the browser
Cheers,
Shadab
Marked as helpful
I have faced issues on making pixel-perfect website because I didn't have any figma file. In this area I am unsure. Gimme some best practices tips and tricks to do better in future.
@bentekku
Posted
Your design looks good, however, here are some pointers:
display: flex;
justify-content: center;
align-items: center;
and yes, do give height of 100vh to the main parent, which could be the body element in your case.
hsl(210, 28, 32, 0.1 );
Overall, you really nailed the design. Good work!
Marked as helpful
@bentekku
Submitted
@bentekku
Posted
I decide to go with wider container for the Desktop version, as it seems to make use of the empty space the best.