Skip to main content

I thought I was on the right track with changing changing the breadcrumb font size color by using: 

doc-layout-breadcrumbs .breadcrumbs {
    font-size: 14px;
    color: black;
}

This successfully changes the font size, but it keeps that font color white (I’m guessing because it is a link?).  Has anyone been able to successfully change the color of the font on the breadcrumb with CSS?

As they are links…

Have you tried adding an   ‘a’   to your CSS like so…

/** Modify Breadcrumbs **/

doc-layout-breadcrumbs .breadcrumbs a {
    font-size: 14px;
    color: black;
}

/** End Modify Breadcrumbs **/

 

Thanks Greg!! ( @gstager )

 

Hi, I am doing the same, and the CSS works for the font. But has anyone been able to change the color of the arrows in the breadcrumbs?

​@margretek - give this a shot and remember to check other areas of the platform to make sure it does not affect unintended areas.

/** Begin Change color of breadcrumb chevrons **/
/** Adjust fill color as desired **/

#doc-layout-breadcrumbs g {
    fill: #000000;
}

/** End Change color of breadcrumb chevrons **/

 

Reply


Terms & ConditionsCookie settings