Design comparison
SolutionDesign
Solution retrospective
What are you most proud of, and what would you do differently next time?
Responsive website design
What challenges did you encounter, and how did you overcome them?Media query for mobile and desktop
Community feedback
- @StroudyPosted 3 months ago
Great solution, Should be proud of this, few things i noticed,
align-items: stretch;
is making your card do some weird stuff, you should instead use something likeobject-fit: cover; width: 100%; height: 100%;
,- Should always use
max-width: 100%
ormin-width: 100%
overwidth:100%
this will make your site more responsive check out responsive-meaning by a frontend mentor dev. - Your media queries should use
rem
orem
notpx
. <img>
tag doesn't half aalt=""
for accessibility and SEO,- Missing a
<meta>
description tag - No
<main>
tag - You have used a lot of
<div>
tags which is semantically incorrect for example<img>
for images,<p>
for paragraphs,<h1> <h2>
for header tags
Keep coding, i look forward to seeing more from you.
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