FAQ block styling

#139859
  • Resolved Rajib
    Rank Math free

    Hey,
    I have added the rank math FAQ block. But the frontend styling looks so ordinary. I want to have the styling like how you guys have shown in your blog

    https://rankmath.com/kb/faq-schema-block/

    Can I have the CSS code to have the same styling as how it is showing on the above link?

    Thanks

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hello,

    Thank you for contacting the support, and sorry for any inconvenience that might have been caused due to that.

    You can make use of this CSS code I pulled out from the example link you sent:

    #rank-math-faq{
        background: #F0F4F8;
        border-radius: 5px;
        padding: 15px;
        margin-bottom: 1rem;
    }
    .rank-math-list-item {
        background: #fff;
        padding: 15px 15px 20px;
        box-shadow: 0px 0px 10px #d1d8dd, 0px 0px 40px #ffffff;
        margin-bottom: 1rem;
        border-radius: 5px;
    }
    .rank-math-question {
        border-bottom: 1px solid #F0F4F8;
        padding-bottom: 0.825rem;
        margin-bottom: 0.825rem;
        position: relative;
        padding-right: 40px;
    }

    Do note that the font size/style will depend on your theme’s main CSS style.

    Hope that helps and please do not hesitate to let us know if you need our assistance with anything else.

    Rajib
    Rank Math free

    Hey
    I added the code but there is no effect at all.

    See the image in the below link

    https://prnt.sc/xl2vl6

    Rajib
    Rank Math free

    My bad. I got it now. thanks again

    Hello,

    We are super happy that this resolved your issue. If you have any other questions in the future, know that we are here to help you.

    If you don’t mind me asking, could you please leave us a review (if you haven’t already) on https://wordpress.org/support/plugin/seo-by-rank-math/reviews/#new-post about your overall experience with Rank Math? We appreciate your time and patience.

    If you do have another question in the future, please feel free to create a new forum topic, and it will be our pleasure to assist you again.

    Thank you.

    Roel John
    Rank Math business

    Hello,

    We can’t inspect element on your site. I check the element in my local and you can try to add margin-top in the rank-math-question class. Try to replace the CSS code .rank-math-question above with the code below and see if that helps.

    Were not sure if that fixes the issue since we can’t inspect element of your site. If the code below not work. Maybe you can share your login info so we can fix your issue on CSS.

    
    .rank-math-question {
        margin-top: 10px;
        border-bottom: 1px solid #F0F4F8;
        padding-bottom: 0.825rem;
        margin-bottom: 0.825rem;
        position: relative;
        padding-right: 40px;
    }
    

    We hope this resolves your issues.

    Thank you

    Hello,

    Since we did not hear back from you for 15 days, we are assuming that you found the solution. We are closing this support ticket.

    If you still need assistance or any other help, please feel free to open a new support ticket, and we will be more than happy to assist.

    Thank you.

Viewing 5 replies - 1 through 5 (of 5 total)

The ticket ‘FAQ block styling’ is closed to new replies.