Skip to content
Submitted over 1 year ago

Responsive, Mobile First Solution Using Flexbox

BeepBot99•40
@BeepBot99
A solution to the 3-column preview card component challenge
Preview (opens in new tab)Code (opens in new tab)

Solution retrospective

How do I make the corners rounded without putting it on each <div> seperately?

Code

Please log in to post a comment

Log in

Community feedback

  • P
    Daniel 🛸•44,790
    @danielmrz-dev

    Hello @BeepBot99!

    Your solution looks great!

    About your question:

    - How do I make the corners rounded without putting it on each <div> seperately?

    You can add border-radius to the container and set it to hide the overflow. Like this:

    .container {
   border-radius: 12px;
   overflow: hidden;
}

    I hope it helps!

    And Happy New Year 🎉😁

    Marked as helpful

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