Archived topic
Yoast breadcrumb left-justified with Title
7 replies · Started by Former User on October 7, 2020
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
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 :)
Hi Leo,
Yes it is ...
Caching plugin is disabled ...
Greetings
Uwe
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.
Hello Elvin,
yeah that's exactly what i wanted.
I tried the css code, unfortunately without success, nothing happens.
regards
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;
}
}Hi David,
That´s it ... :-)
Thanks so much, have a nice day!
Regards
Uwe
You're welcome
