Solved

Styling mobile Breadcrumbs Prestige

NZA
Shopify Partner
128 12 34

Good day everyone,

I was able to add breadcrumbs recently to my store,

I managed to style it properly on desktop thanks to the community here, but on mobile it still looks bad

I would like to apply there css setting on mobile but i don't know how 

    padding: 15px;
    background: #ffff;
    font-size: 14px;
    margin-top: 0px;
    margin-left: 0px;
    

I would really apreciate some help with this!

Store url: https://donutsole-hu.myshopify.com/

Password: twilye

Thank you very much in advance!

Accepted Solution (1)

dmwwebartisan
Shopify Partner
12280 2546 3693

This is an accepted solution.

@NZA 

Please add the following code at the bottom of your assets/theme.css file.

@media screen and (max-width: 640px){
nav.breadcrumb, nav.breadcrumb a.Breadcrumbs, nav.breadcrumb span {
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 30px;
    font-size: 12px;
    text-transform: uppercase;
}
}

 

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app

View solution in original post

Replies 3 (3)

khilan
Shopify Partner
271 15 26

hi @NZA 

please give me a screen short .

thank you so much.

khilan

Shopify Expert | Skype: khilan.mendapara
- Like and Mark as an Accepted Solution if reply helpful
- Feel free to contact me on khilan.mendapara1995@gmail.com regarding any help
NZA
Shopify Partner
128 12 34

@khilan 

Current mobile:

donutsole.hu _ C.png

Current Desktop:

Nike Air Jordan .png

dmwwebartisan
Shopify Partner
12280 2546 3693

This is an accepted solution.

@NZA 

Please add the following code at the bottom of your assets/theme.css file.

@media screen and (max-width: 640px){
nav.breadcrumb, nav.breadcrumb a.Breadcrumbs, nav.breadcrumb span {
    margin-left: 5px;
    margin-right: 5px;
    margin-top: 30px;
    font-size: 12px;
    text-transform: uppercase;
}
}

 

Hope this works.

Thanks!

If helpful then please Like and Accept Solution | Email: dmw.webartisan@gmail.com |  Instagram: @dmw.webartisan
Check here PageFly App to customize your pages | #1 Product Filter & Search app on Shopify | The most powerful Shopify page builder app