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

Order summary card with HTML and CSS

@AndreiM987

Desktop design screenshot for the Order summary component coding challenge

This is a solution for...

  • HTML
  • CSS
1newbie
View challenge

Design comparison


SolutionDesign

Solution retrospective


I could not round the border top of svg image, instead i convert the svg to jpg and apply css: border-top-left-radius: 10px; border-top-right-radius: 10px; Do you know how to do that?

Community feedback

P
Katrien S 1,070

@graficdoctor

Posted

Since you set a border-radius on your .container, you can just use overflow: hidden on the .header

.header {
  overflow: hidden;
}

Marked as helpful

0

@AndreiM987

Posted

@graficdoctor Thank you a lot! I dont't belive it's that simple :) I struggled a lot to solve the problem.

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