The Breadcrumb CSS and Style Settings

Using CSS is a great way to edit your Breadcrumbs Area.

Here are our base styles that are used for the Breadcrumbs and we cover how to use each area further down in this document.

We have 4 main styles for the Divi Breadcrumb Module:

Left Aligned

This is when all the main content for the product is Left Aligned. See the Screenshot below.

Divi Breadcrumb Left Aligned

Center Aligned

The center aligned version of the breadcrumb has all the content in a center alignment setup.

Right Aligned

This is when we have all of the content over to the right hand side of the breadcrumb.

Title left and Breadcrumb Right

This is when you have your breadcrumb over on the left side of the page and the breadcrumb to the right. The subtitle will also be left aligned with the page title.

The CSS Classes.

The css that makes this all happen is pasted below.

We include a specific style sheet with the module to help you make it work well.

If you are wanting to overwrite anything you can see the class names and targets we have used.

This should be helpful for the coders out there.



30 day Money Back Guarantee

30 day Money Back Guarantee

If you aren't happy with our products, you get your money back. No questions asked.
Full Support on Every Product via our Helpdesk

Full Support on Every Product via our Helpdesk

Excellent documentation and dedicated support are all part of the service
Secure using Stripe and PayPal

Secure using Stripe and PayPal

We take your security seriously and have every page secured via SSL on our site.

We Offer both PayPal and Stripe for Payment.


Join our mailing list to receive the latest news and updates from our team.

You have Successfully Subscribed!