Responsive Recipe Page

Community feedback

• 

  P

  Alper•1,010

  @adonmez04Posted 9 months ago

  Hi @RevadiSundaram. That's a good solution, keep coding. Here are some tips for you:

  • You don't need to use the width property for your container element. Use max-width or max-inline-size instead. You can use the declaration max-width: 800px; instead of the width: 800px; in your main element. This will make your container element responsive. You also will need to change the width: 300px; declaration for the media at-rule to max-width: 300px;

  • You can give your img element max-width: 100%; and display: block; which will make your img elements responsive.

  Note: Try to solve the same challenge at least twice, it will teach you something different each time.

  I hope these will help you. Keep coding and have a nice day...

  Marked as helpful

  0

  ---

  

  Revadi Sundaram•90

  @RevadiSundaramPosted 9 months ago

  @adonmez04 Thank you for the feedback. Will be implementing it for next projects.

  1
• 

  P

  Juan•10

  @juanperez06Posted 9 months ago

  Hey Revadi

  Nice work! The only thing I would suggest you is to focus on website responsiveness. Your project isn't responsive. Try minimizing the browser window to see what I'm talking about. In smaller devices your project will be hard to read. This is not the best user experience (UX).

  0