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

Responsive Recipe Page Using Flexbox, negative margin

Raptor0x1 210

@Raptor0x1

Desktop design screenshot for the Recipe page coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


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

  • Even though I faced many problems but I didn't give up and completed the project. I'm proud to complete this.

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

  • For me the toughest part was how to let the header image take the full width for the mobile screen. For the image to take full width it had to neglect the padding of the container. So to overcome this I used the negative margin and it solved the problem.

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

  • I'll will be happy if someone could tell different method other than using negative margin to fit the image on the top completely taking the width of the container.

Community feedback

@BhargavMarala

Posted

looking good and exactly.

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