Design comparison
Solution retrospective
Iโm proud of myself for creating and deploying my first live application. Although itโs a simple app, it was my first time doing this. I used online references to complete the solution, but next time, I plan to rely more on my own efforts. Throughout this process, I learned a lot about CSS and how to deploy using Vercel.
What challenges did you encounter, and how did you overcome them?I encountered some difficulty while writing the CSS code, particularly in accurately positioning the QR element according to the design. I referred to a few CSS tutorial websites for syntax and values, and after some trial and error, I was able to get it right.
What specific areas of your project would you like help with?CSS techniques
Community feedback
- @ima9ghPosted 3 months ago
Hello there!
๐๐ผ๐ป๐ด๐ฟ๐ฎ๐๐๐น๐ฎ๐๐ถ๐ผ๐ป๐ ๐ผ๐ป ๐ฐ๐ผ๐บ๐ฝ๐น๐ฒ๐๐ถ๐ป๐ด ๐๐ต๐ฒ ๐ฐ๐ต๐ฎ๐น๐น๐ฒ๐ป๐ด๐ฒ.
๐ฌ๐ผ๐๐ฟ ๐ฝ๐ฟ๐ผ๐ท๐ฒ๐ฐ๐ ๐น๐ผ๐ผ๐ธ๐ ๐ด๐ฟ๐ฒ๐ฎ๐.
I have a suggestion to improve your challenge!
โTo move the card to the center of the page, change the ๐๐ฆ๐ฆ code:
body{ display: flex; justify-content: center; align-items: center; min-height: 100vh; box-sizing: border-box; }
โTo correctly break the words in your ๐ค๐ฟ ๐ฐ๐ผ๐ฑ๐ฒ:
๐๐ผ๐ฟ๐ฑ-๐ฏ๐ฟ๐ฒ๐ฎ๐ธ can be used to break words and make texts more similar to the main challenge.
๐๐ณ ๐๐ต๐ฒ๐ ๐ฎ๐ฟ๐ฒ ๐ป๐ผ๐ ๐ฏ๐ฟ๐ผ๐ธ๐ฒ๐ป ๐ฎ๐ ๐๐ผ๐ ๐๐ฎ๐ป๐, ๐ท๐๐๐ ๐ฟ๐ฒ๐ฑ๐๐ฐ๐ฒ ๐๐ต๐ฒ ๐๐ถ๐ฑ๐๐ต ๐ผ๐ณ ๐๐ต๐ฎ๐ ๐ถ๐๐ฒ๐บ!
Let me know if this comment was helpful.
๐๐ผ๐ผ๐ฑ ๐น๐๐ฐ๐ธ ๐ฐ๐ผ๐ฑ๐ถ๐ป๐ด!
Marked as helpful1
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