[Resolved] Yoast breadcrumb left-justified with Title

[Anonymous]

Hello GP team,

I placed my yoast breadcrumb (YB) below the title of the website. Now I’ve switched to flexbox.

In the desktop view, YB is still flush with the title, in the table and mobile view it is no longer.

When I work in CSS

.yoast-breadcrumb {
margin-left: 20px;
}

stored it is exactly the opposite. It becomes flush in the table and mobile view, but not in the desktop view.

Is there a solution to keep all three views flush with the title?

regards

Uwe

[Leo]

Hi there,

What do you mean by flush with the title?

This is what I’m seeing on the desktop:
https://www.screencast.com/t/ImPd2p3ZbAW

Is that what you want?

Can you disable the caching plugin so I can take a closer look at the code?

Thanks 🙂

[Anonymous]

Hi Leo,

Yes it is …

Caching plugin is disabled …

Greetings

Uwe

[Elvin]

Hi,

Did you mean you want the site title and breadcrumb to also be aligned on mobile and tablet?

If so, you can try this CSS code.

@media (max-width:880px) and (min-width:769px){
   margin-left: 10px;
}

@media (max-width:768px){
   margin-left: 20px;
}

I’ve added 880px media query because you have a CSS code that pushes the site title 10px to the right @ 880px.

[Anonymous]

Hello Elvin,

yeah that’s exactly what i wanted.

I tried the css code, unfortunately without success, nothing happens.

regards

[David]

Hi there,

add this CSS to your site:

@media(max-width: 880px) and (min-width: 769px) {
    .yoast-breadcrumb {
        padding: 0 10px;
    }
}
@media(max-width: 768px) {
    .yoast-breadcrumb {
        padding: 0 20px;
    }
}

[Anonymous]

Hi David,

That´s it … 🙂

Thanks so much, have a nice day!

Regards

Uwe

[David]

You’re welcome

[Author]

Posts