HTML, CSS, Flexbox -- (Need help with border-radius)

Community feedback

• 

  darryncodes•6,370

  @darryncodesPosted about 3 years ago

  Hi Daniel,

  Nice one!

  You might want to add transition: ease-in .3s; and cursor: pointer; to your button to have more of a button feel and smooth hover affect.

  Marked as helpful

  1

  ---

  

  Daniel Haro•50

  @o0oDanielHaroo0oPosted about 3 years ago

  @darryncodes Thank you!

  That's a great tip, will do!

  0
• 

  P

  Patrick•14,265

  @palgrammingPosted about 3 years ago

  well you you need to put the border raidus on the corners of your cards that need them

  Put this on your orange card border-radius: 20px 0 0 20px; then look at how the dark cyan card compares to the results on the orange

  the key is you have to transition the border radius corners on the cards depending if it is the mobile or desktop layouts

  Marked as helpful

  1

  ---

  

  Daniel Haro•50

  @o0oDanielHaroo0oPosted about 3 years ago

  @palgramming Hey, thanks for the reply!

  Well yeah that definitely fixes it but I still don't understand why wasn't it working before. The father element ".card" of the columns does have the border-radius property and overflow hidden and it works just fine in smaller widths but when screen gets to 1055px it just starts straightening. I appreciate the solution but I don't understand what is the actual problem and why it happened.

  0