Change the Product Breadcrumbs Padding

Hi!

Does anyone know how to alter the heading of the padding on the product s?

I like the feature but it doesn't need to take up anywhere near that much space on the page. I'd like it to just be barely larger than the text.

Many thanks in advance!

I've been playing around with the CSS seeing if I could jostle free a few of the brain cells I had last time I played with it over 10 years back and to my surprise I managed to figure it out that way.

I'm not sure its the Right way to do it but the code I used was 
 

/* Change Top Breadcrumb Size */
h3.nested-category-title {
    font-size: 40px !important;
    padding-top: 5px !important;
    padding-bottom: 7px !important;
}
.collection-content-wrapper {
      padding-top: 10px !important;
}

.nested-category-breadcrumb {
    font-size: 20px !important;
    padding-top: 8px !important;
    padding-bottom: 8px !important;
}

This Also changes the font sizes of the product title and breadcrumb FYI.

Have you solved this yet? If no, let me know, we can give the exact code

Hey @tuanphan,

I am having trouble with this on 7.1. As you can see there isn't enough padding above the breadcrumb links.

Any ideas?

Thanks!

20 hours ago, markadekoning said:

Hey @tuanphan,

I am having trouble with this on 7.1. As you can see there isn't enough padding above the breadcrumb links.

Any ideas?

Thanks!

If you share link to a product, we can check easier

Any product is fine.

6 hours ago, markadekoning said:

Any product is fine.

https://thehomecollectivecomau.squarespace.com/

 

Password: Thehomecollective

 

Thanks!

Add to Design > Custom CSS

/* Product breadcrumbs */
nav.ProductItem-nav {
    padding-top: 100px;
}

Thanks very much.