Single price grid component

Community feedback

• 

  Bryan Li•3,530

  @Zy8712

  Posted over 1 year ago

  Your site looks pretty.good. If I'm reading your question right, you should be able to just declare border-radius for the parent container that holds all three sections and then just use overflow: hidden to make the individual sections seem curved in the proper places as well.

  Hope this helps

  10
• 

  Marzuk Sanni•1,360

  @Zukizuk

  Posted over 1 year ago

  Hello there

  Congratulations on completing this project

  I have few suggestions about what you asked about that might be of help to you:

  When you set border-radius on the parent, it doesn’t automatically apply to the child unless you explicitly define it. This allows for flexibility in styling, as you might want the child to have a different border-radius than the parent for design reasons.

  If you want the child to inherit the border-radius from the parent, you can use the inherit value like this border-radius: inherit so that it takes the border-radius of it's parent without have to type it.

  Also you can consider using properties like the following together with border-raduis: unset;

    border-bottom-left-radius: 2rem;
    border-bottom-right-radius: 2rem;
    border-top-right-radius: 2rem;
    border-top-left-radius: 2rem;
  

  this way you can unset the value and specify exactly where you need the radius without having to do something like border-radius: 0 0 0 0;

  I hope this feedback helps.

  00