Design comparison
Solution retrospective
-
How could I Improve the responsiveness of the page ?
-
How can I reduce the lines of code to make it more compact ?
-
What is the right approach to build this page ?
Community feedback
- @feliceNicolasBarcellonaPosted over 1 year ago
It is good practice to separate CSS code from HTML code (separation of concerns). Therefore, I recommend creating a file, for example, styles.css and moving all the CSS code there, and then linking it inside the head section ( https://www.w3schools.com/tags/tag_link.asp )
for proper display of the image try removing the path preceding images from Web-Dev-Projects/images/image-qr-code.png to images/images-qr-code.png
use @media only screen and (max-width: 768px) for mobile
Marked as helpful0@hemanth33Posted over 1 year agoThank you for your Valuable feedback @feliceNicolasBarcellona
0 - @MatanskiPosted over 1 year ago
Well ,from what i can see your website is based on % and margin. It's a creative solution, but i would suggest you try to use flex/grid if you want responsiveness. I would also suggest you take the css and put it in a style.css instead of style, just because it's the norm in the industry.
For me, the right approach is first creating the raw index.html code, than see how you can use flex/grid to build the entire layout and than start 1 element at a time.
Overall, the code look's pretty clean so other than that good job! :) if you want you can contact me at discord (matanski#2225) if you need any help
Marked as helpful0
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