Design comparison
Solution retrospective
I'm still having problem with getting it to fit the mobile view. Someone should please help out. Than you.
Community feedback
- @correlucasPosted about 2 years ago
👾Hi RavanCod, congratulations for your first solution!👋 Welcome to the Frontend Mentor Coding Community!
The html structure is fine and works, but you can reduce at least 20% of your code cleaning the unnecessary elements, you start cleaning it by removing some unnecessary
<div>
. For this solution you wrap everything inside a single block of content using<div>
or<main>
(better option for accessibility) and put inside the whole content<img>
/<h1>
and<p>
.<body> <main> <img src="./images/image-qr-code.png" alt="Qr Code Image" > <h1>Improve your front-end skills by building projects</h1> <p>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</p> </main> </body>
It's even better to use
relative units
asrem
orem
that have a better fit if you want your site more accessible between different screen sizes and devices.REM
andEM
does not just apply to font size, but to all sizes as well.✌️ I hope this helps you and happy coding!
Marked as helpful0 - @satzzzzz07Posted about 2 years ago
Hey there, Great work on your first solution! Design looks good. There are few suggestions:
- Mobile-responsive - To create mobile responsive websites you can use the help of
media-queries
checkout : css media queries
Few design suggestions (for current project)
-
Try to not use the
border-radius
property on the overall container (code div), so it matches the style. -
for the credits (Challenge by Frontend Mentor Coded by Anazodo Vanessa) you can add both of your p tags outside of the
.code
div, so that they are outside of your code div container.
Aside these, excellent work again and happy coding :) 👍
0@vanessie2424Posted about 2 years ago@satzzzzz07 thank you. I will get to it and correct it.
0 - Mobile-responsive - To create mobile responsive websites you can use the help of
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