All comments

• 

  ks9927• 70

  @ks9927

  Submitted 13 days ago

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

  I'm proud of how quickly this was able to come together. Next time I need to work more on my CSS because I feel like I could have done the positioning of everything in an easier way.

  What challenges did you encounter, and how did you overcome them?

  I struggled with the positioning and sizing. Luckily with the sizing I was close enough compared to the figma design. With the positioning I had to keep googling different CSS properties but I did figure it out eventually. But I do feel like I could have made things like the bottom text more exact to the photo.

  

  QR Code Project

  1

  20

  

  KoalaChang• 10

  @KoalaChang

  Posted 5 days ago

  Hi, ks9927! Congrats for Your Great Work on This Project

  It's amazing you use such clear css code to complete this challenge! Honestly I don't feel like there's anything to revise. But here's some nit-picking for your work.

  The Position of The Component

  I'm not sure why your screenshot looks like the component is so close to the top of the viewport? A possible cause is that you didn't put a reset on the whole document (just a guess)

  * {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
  }
  

  In this part of code, I clear all the margin and padding for a reset of my project, and set the box-sizing to border-box, which made my child containers will be right inside the parent containers. (ref: MDN - box-sizing)

  and for the body part, I add a property height and set to 100vh to make sure it would take the whole height of the viewport.

  Small Text Align

  This is a really small point about your small text since it's a little exceed the design example. The way I get through this is to set it to display: block and set the margin to 20px, and this work for me.

  Conclusion

  Despite of all the advices I wrote, I am really surprised of your job! Since my CSS code is so long and redundant compare to yours. It's really nice to have a chance to have a feedback to your code, hope everything goes well!

  0