Skip to content
Submitted 10 months ago

Simple Centered Box

Mohammad-Moneer•120
@Mohammad-Moneer
Preview site (opens in new tab)View code (opens in new tab)
This is a solution for...QR code component
  • HTML
  • CSS
1newbie

Design comparison

SolutionDesign

Solution retrospective

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

I can say I am proud of being able to build HTML structure for this project easily. but next time I need to take care of semantic elements even in simple projects like this one.

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

The challenge I encountered was how to make the box shadow similar to the design as possible, and I just guessed it.

What specific areas of your project would you like help with?

How to make the box shadow exactly like the design?

Community feedback

  • Melvin Aguilar 🧑🏻‍💻•61,140
    @MelvinAguilarPosted 10 months ago

    Hello there 👋. Good job on completing the challenge !

    I have some suggestions about your code that might interest you.

    HTML 🏷️:

    • Use semantic elements such as <main> and <footer> to improve accessibility and organization of your page.

    CSS 🎨:

    • Use min-height: 100vh instead of height. Setting the height to 100vh may result in the component being cut off on smaller screens, such as a mobile phone in landscape orientation.

    I hope you find it useful! 😄 Above all, the solution you submitted is great!

    Happy coding!

    Marked as helpful
    3
    Mohammad-Moneer•120
    @Mohammad-MoneerPosted 10 months ago

    @MelvinAguilar I am glad to get the first and valuable comment on my first project on Frontend Mentor, I really think I will have a very useful experience here. Thank you so much, I will soon update this solution taking in consideration your appreciated notes.

    0

Please log in to post a comment

Log in with GitHub

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