Takeaways: This challenge involved dealing with different layers, positioning and curves - which was a new challenge for me.
The biggest takeaway was the curved sections. I went through a few different approaches including a large scaled circle and another method with the usage of the clip-path css field but ultimately ended up using a standard rectangular shaped div with an overlapping eclipse shaped div at the very bottom.
I felt this was the best route to take as setting width to 100% made it responsive from the get go.
Let me know any feedback or any different approaches that I may have missed!
Hi, well done for this challenge.
It has a good behavior when you resize it, after for the curve I put it directly in the background properties.
You need to use more HTML tag like header, main, section to structure your page instead a lot of div. It's better for the screen reader.
Marked as helpful
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
