I used HTML and CSS with media queries for my responsiveness

Community feedback

• 

  Daniel 🛸•44,270

  @danielmrz-devPosted 11 months ago

  Hello @MamaFati!

  Your project looks pretty good!

  Since you already got some help here, I have just one suggestion:

  • That div.attribution is supposed to be a footer. You can place it outside the card so it does not take up space unnecessarily in the main content.

  • Also, if you add a box-shadow to the card, it'll look even closer to the original design.

  I hope it helps!

  Other than that, great job!

  Marked as helpful

  2

  ---

  

  Abu Fati•50

  @MamaFatiPosted 11 months ago

  @danielmrz-dev Thank you very much for your feedback, I going to improve it and also use it for my upcoming projects

  1

  

  Daniel 🛸•44,270

  @danielmrz-devPosted 11 months ago

  I'm glad I could help 😊 @MamaFati

  1
• 

  Melvin Aguilar 🧑🏻‍💻•61,140

  @MelvinAguilarPosted 11 months ago

  Hello there 👋. Good job on completing the challenge !

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

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

  • The <div> tag can be useful for styling and positioning, but it doesn't convey any semantic meaning. Instead, consider using more semantic elements like <p> to better describe the type of content. e.g.: <p>Scan the QR code to visit Frontend Mentor and take your coding skills to the next level</p>.

  • You can use the following styles to center the element effectively using either of these two methods: For Grid:

    body {
      min-height: 100vh;
      display: grid;
      place-items: center;
      /* Additional styles if needed */
    }
    

    For Flexbox:

    body {
      min-height: 100vh;
      display: flex;
      justify-content: center;
      align-items: center;
      /* Additional styles if needed */
    }
    

    Later, you can remove this margin:

     .main{
         /*  margin: 5% auto 5% auto; */
         [...]
    }
    

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

  Happy coding!

  Marked as helpful

  1

  ---

  

  Abu Fati•50

  @MamaFatiPosted 11 months ago

  @MelvinAguilar Hi Melvin, your suggestions have been helpful. I have even learnt a new way of centering an element. Thank you 🥰

  0
• 

  Abu Fati•50

  @MamaFatiPosted 11 months ago

  Thank you all for your feedbacks, I have made some changes. Your Feedbacks are welcome

  0