Customize Breadcrumb line height and padding on the product description page

Hello.  While using the OOTB SQSP line height and padding config options on the product item page within my store to have the product description text appear with spacing as I would like, I notice that the top of the breadcrumb at the top of the product description page is now partially cutoff.  This leads me to the conclusion (not sure if I am right), that the line height and/or padding controls not only impact the product description text but also the breadcrumb display text.

I am guessing that the only way to get around this would be to insert some custom css to override the look of the breadcrumb.  Could anyone provide me with the css id for the breadcrumb on the product description page. Thank you so much for your help.

https://nmpane.com/store/p/existential-crisis-mug

The url I provided above will show you the cutoff breadcrumb on a desktop.

Thanks again

You can use this code to Website > Website Tools > Custom CSS

a.ProductItem-nav-breadcrumb-link {
    line-height: 24px !important;
}

In the same topic,  is it possible to add a bread crumb on plain or  portfolio pages or breadcrumb works only in store pages ? TIA

On 7/12/2024 at 2:08 PM, eZeeBags said:

In the same topic,  is it possible to add a bread crumb on plain or  portfolio pages or breadcrumb works only in store pages ? TIA

With other pages, we will need to use custom code to add breadcrumb.

You can share link to a page or portfolio page & which position you want to add it, we can test code easier