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

QR code Component

@Katemuya

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


After a while, I am making my way back to coding and thought I should start with this project. I am open to any constructive comments, suggestions or feedback. Thank you :)

Community feedback

@RafaelSS427

Posted

Hi Catherine, I was looking at your solution. Styles are fine but I see you have problems with the size container, I suggest leaving the width on "auto" and centering it with the flex or grid property. For example:

<div class="container">  [use flex or grid] 
  <div class"card-container">  [width: "auto"] 
   <img />
   ...
  </div>
</div>

The width size will adapt to the defined size of your image. You can practice with the flex property in this web site: FLEXBOX FROGGY

Marked as helpful

0

@Katemuya

Posted

@RafaelSS427 thank you very much for checking my work and the suggestion. The game recommendation was a game changer. I learnt so much. Cheers  🥂

0

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