Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

deisgn-qr-code-component-main

@Asledin-max

Desktop design screenshot for the QR code component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


What are you most proud of, and what would you do differently next time?

Hello there, this is my first code challenge for any feedback you welcome.

Community feedback

@Vanfrankie7

Posted

Great job Asledin, I noticed that in the desktop version, the container (card) is stuck at the top of the screen. No margin at the top. You could add a margin at the top to see if that would solve the issue.

0

geomydas 1,330

@geomydas

Posted

@Vanfrankie7 no no no, you should use padding instead. its using fixed heights aswell which is unresponsive and there are more issues inside the css

0

@Vanfrankie7

Posted

@geomydas So, is it only containers with fixed heights that margin-top is advisable for? Containers without fixed heights should be applied padding instead?

0

@Asledin-max

Posted

@Vanfrankie7 Thank you for your comment. I understand now what should be careful in my design and will fix it that issue.

1
geomydas 1,330

@geomydas

Posted

@Vanfrankie7 even if you use fixed-height or not, you would still use padding for this case. using fixed-height here is already unresponsive and you wouldn't need to set a height to an element in the first place. the only exception for fixed heights are small decorations that wont change such as a profile picture

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join 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