Return to previous page

Breadcrumb align left still remains in the centre of the page?

This topic has 6 replies, 2 voices, and was last updated 1 years, 2 months ago ago by Rose Tyler

Chris Barrett

Participant

September 13, 2023 at 14:32

Hello, I really wish to be able to neatly position the Breadcrumb at top of pages on desktop, mobile, tablet as shown in screen grab – Can you help please? Ive tried using Breadcrumb aline left, etc and it appears of the page

Please, contact administrator
for this information.

#367397 Copied Theme version: .9.1.13 WooCommerce version: 8.1.0

5 Answers
Rose Tyler

Support staff

September 13, 2023 at 14:55
Hello, Chris Barrett,

Thank you for contacting us and for using XStore.

It looks like you are using an additional plugin that affects breadcrumbs. Please try the next custom CSS code:
```
.breadcrumb-trail .page-heading > div {
    display: inline-block;
    width: auto;
    padding: 0;
}
.breadcrumb-trail .page-heading {
    text-align: start;
    width: 100%;
    margin: 0 auto;
    color: currentColor;
}
@media only screen and (min-width: 768px) {
    .breadcrumb-trail .page-heading {
        max-width: 750px;
    }
}
@media only screen and (min-width: 992px) {
    .breadcrumb-trail .page-heading {
        max-width: 970px;
    }
}
@media only screen and (min-width: 1200px) {
    .breadcrumb-trail .page-heading {
        max-width: 1460px;
    }
}
.breadcrumb-trail .breadcrumb_last.title {
    margin-left: 5px;
}
```
Kind Regards,
8theme team
#367399 Copied
Chris Barrett

Participant

September 14, 2023 at 10:00

Hi, thanks for the CSS code, I just added and you can see the breadcrumb is positioned on the far left of page. Best Chris

#367454 Copied
Rose Tyler

Support staff

September 14, 2023 at 13:05
Hello, Chris Barrett,

Please use the next code also:
```
.breadcrumb-trail .container {
    display: inline-block;
    width: auto;
    padding: 0;
}
```
and set margin-left/margin-right 0px via Theme Options > Breadcrumbs.

Kind Regards,
8theme team
#367473 Copied
Chris Barrett

Participant

September 14, 2023 at 21:25

Apologies, I couldn’t follow what you mean by set margin-left/margin-right 0px via Theme Options > Breadcrumbs. I couldn’t see it on my screen as shown?

Please contact administrator
for this information.

#367513 Copied

Rose Tyler

Support staff

September 15, 2023 at 06:06

Hello, Chris Barrett,

We appreciate your prompt response.
Please clear cache and check now.

Kind Regards,
8theme team

#367517 Copied
Tagged: breadcrumb alignment issue, fix breadcrumb alignment, woocommerce breadcrumb problem, woocommerce templates, wordpress breadcrumb centered, wordpress template troubleshooting
Viewing 6 results - 1 through 6 (of 6 total)