Latest solutions
Responsive product page using media queries and JavaScript
#sass/scssSubmitted 5 months agoAny suggestions are welcome. :)
Social links page using HTML and CSS
Submitted 6 months agoI don't have any specific doubts. Feel free to suggest improvements or point the flaws in the code or design, so that I can improve myself. :)
Blog preview card solution
Submitted 6 months agoHow do I make the font size reduce for mobile screen? I tried using rem instead of px. Is there another way?
qr-code component page using html and css
Submitted 6 months agoI don't know how to find the exact font-family. I just put whatever margin or padding to make it look exact, if there is a way to do that systematically, I want to know it.
Latest comments
- @sanjv12@Charles7458
Your solution is great. But in the team builder and calculator cards you have forgotten to add padding in the bottom, because the image hits the bottom of the card. Otherwise, great work, let's keep learning.
- @Mohamed-Badr-Saad@Charles7458
When resizing, it's responsive only at 320px, it should be responsive at 375px too. And in the mobile site, the card is not centered vertically, some margin at the top can fix it.
Only these 2 problems, besides that its great.
And I learnt from your code that we can enter min-width while linking the stylesheet, thanks. Let's keep learning.
Marked as helpful - @DaniAe@Charles7458
It looks great. Well done!
- @brodel10@Charles7458
It looks the same as the design. Nice!
- @pruwtWhat are you most proud of, and what would you do differently next time?
This challenge was much more seamless compared to the previous QR component. Approaching responsiveness by using simple fundamental principles, like not using px for elements except images, for instance, helped. I'm proud of improving on the responsiveness. It was much easier, which I guess is a sign of improvement.
What challenges did you encounter, and how did you overcome them?For challenges faced, even though there was an improvement with my approach to responsiveness, I think there's still much more work to do. For instance, units such as em and rem, even though I understand them, I must say it's a bit confusing. Additionally, thinking critically on when to use max width is something that's starting to make sense.
What specific areas of your project would you like help with?I think trying to match the design as closely as possible is still in the works. I need help on the best way to handle the margins (mostly top and bottom) in this case (I didn't use auto in this case). That's pretty much it
@Charles7458Your project looks exactly the same as the design, but the card is not centered.
I used this to center the card:
body{min-height: 100vh;}
But overall, good job.
- @PaucotEnzo@Charles7458
The solution looks exactly as the design.