How do I align my Breadcrumb with page width dynamically?

[miltokas]

Hi guys!

I want to align my Breadcrumb with page width without need of padding or any other workaround.

my current code in base.css

.breadcrumb {
margin: 0 auto !important;
max-width: var(--page-width);
}

There: Dawn

Website: www.vengastore.com

[PageFly-Henry]

Hi @miltokas 

This is Henry from PageFly - Landing Page Builder App

You can try this code by following these steps: 

Step 1: Go to Online Store->Theme->Edit code.

Step 2: Search file base.css

Step 3: Paste the below code at bottom of the file -> Save

nav.breadcrumb {

    width: 100% !important;

    padding: 0 15rem !important;

}

Hope that my solution works for you.

Best regards,

Henry | PageFly

[miltokas]

@PageFly-Henry thanks a lot for your answer.

I have added the code you provided but it is still misaligned:

[PageFly-Henry]

Please try again with this code:

nav.breadcrumb {
width: 85%!important;

}

[miltokas]

I have tried but still a bit off.

My question is, can I automatically align with the theme page width?

Thanks!

[PageFly-Henry]

Yes, you can try changing the width parameter in my code to make it more suitable for you.