Okay
  Public Ticket #4108621
Border Radius on Flip Box
Open

Comments

  •  1
    3AH started the conversation
    6 days ago on Tuesday at 2:59pm

    Hello Salient Team,

    Can you please advise how to implement a border radius (e.g. 10px) to create a flip box with rounded corners?

    Thanks!

    - J.

  •  328
    Noah replied
    6 days ago on Tuesday at 10:33pm

    Hi J.,

    Thank you for reaching out.

    This can be done with a custom CSS snippet.

    Please add the following code to your Salient > General Settings > CSS/Script Related > Custom CSS Code box:

    .nectar-flip-box,
.nectar-flip-box .flip-box-front,
.nectar-flip-box .flip-box-back {
    border-radius: 10px !important; 
}

    Give it a try and let us know how it goes.

    Best wishes,

    Salient Support

  •  1
    3AH replied
    6 days ago on Tuesday at 11:30pm

    Thanks, Noah!

    And if we want to target the code to this page, how would we amend the CSS?

    https://readingpartnership.com/teaching-our-children-to-read/

    - J.

  •  328
    Noah replied
    6 days ago on Wednesday at 12:29am

    Hi J.,

    Thank you for getting back to us.

    You can target an individual page using its class name found in the body tag. For the page you shared, the class name identifier is “page-id-3300.”

    Hope this helps! Please let us know if you need any further assistance.

    Thanks again,

    Salient Support