Design comparison
SolutionDesign
Solution retrospective
Any feedback is welcomed and appreciated! :)
Community feedback
- @hyde-brendanPosted almost 3 years ago
Hi! Great job completing this challenge! Some comments:
- Using a % value on
border-radius
tends to be uneven on elements that aren't square; you can see on your<main>
how the curve is stronger on the vertical side than the horizontal. Best to stick to an explicitpx
orem
value for this case. - Instead of setting the vertical
margin
to10%
, you can center items vertically by placing the below CSS under your<body>
:
min-height: 100vh; display: grid; place-items: center;
(Note you'll have to set
position: absolute;
on your.attribution
element as well so the above works.)- To fix the Page should contain a level-one heading issue, change your
#title
element from<p>
to<h1>
(and adjust accordingly). - For next time, try playing around with
box-shadow
to get the slight shadow on the card!
Marked as helpful2@Irving2797Posted almost 3 years ago@hyde-brendan thanks for the feedback. Definitely will implement these. Awesome advice!!
0 - Using a % value on
- @EmmanuelHexerPosted almost 3 years ago
Great job man. Keep it up
1
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