Breadcrumbs styling

#416772
  • Resolved Gaetan

    2 years, 5 months ago

    Rank Math pro
    Content AI Starter

    The rankmath breadcrumbs are working fine, thanks for this feature! I would like to achieve the following:

    regular breadcrumbs:

    Home>level1>level2>we-are-here

    I want the actual level to be bold or with an other collor like this:

    Home>level1>level2>we-are-here

    Or formulated differently: How do i target the last item in the breadcrumbs string so i can style it with css? (set font to bold)

    Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)
  • Jaideep Asrani

    2 years, 5 months ago

    Hello,

    Thanks for contacting us and sorry for any inconvenience that might have been caused due to that.

    You can use the following selector to target the last element of the breadcrumbs:

    .rank-math-breadcrumb .last

    Hope this helps. Let us know if you need any other assistance.

    Gaetan

    2 years, 5 months ago

    Rank Math pro
    Content AI Starter

    This doesn’t seem to work:

    /*broodkruimels van rank math*/
    .rank-math-breadcrumb {
    display: flex;
    justify-content: left;
    font-family: Lato, Arial, Helvetica, sans-serif;
    font-size: 16px;
    color: grey;
    }
    .rank-math-breadcrumb > p {
    background: none;
    margin-bottom: 0;
    padding: 5px;
    }
    .rank-math-breadcrumb a {
    color: grey;
    }
    .wp-block-code {
    border: 0 !important;
    }
    .rank-math-breadcrumb .last {
    font-style: black;
    color: #999999;
    }
    /*einde broodkruimels van rank math*/

    Gaetan

    2 years, 5 months ago

    Rank Math pro
    Content AI Starter

    I got it to work, thanx!

    Princess

    2 years, 5 months ago

    Hello,

    Glad that everything has been sorted out. If you have any other questions in the future, know that we are here to help you.

    Thank you.

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

You must be logged in to reply to this ticket.