[Resolved] shopping cart and search button on the right for mobile

[Silvia]

Hello,

I’m adding an online shop to my site, and the header of the mobile view is not good because of the shopping cart icon. It has taken the place of the search button, which was on the right before. The search button is now centered and overexposed on the logo. Is it possible to have both icons on the right? Shopping cart and search button.

Thanks

[Leo]

Hi there,

Try adding this CSS:

#mobile-header .mobile-bar-items.wc-mobile-cart-items {
    margin-left: 0;
}

Adding CSS: https://docs.generatepress.com/article/adding-css/

Let me know if this helps 🙂

[Silvia]

Hello, it’s better but not exactly what I would like. Adding that CSS I have:
on the left: search icon – shopping cart – Menu
on the middle: logo
on the right: nothing

What I would like is:
on the left: Menu
on the middle: logo
on the right: search icon – shopping cart

Is that possible?

Thanks

[David]

Hi there,

can you disable the Autoptimize so i can see what CSS has already been added and i can then provide the correct CSS

[Silvia]

Sure, I’ve just disabled the plugin. I didn’t changed the CSS finally as it wasn’t the result I was looking for.
Thanks for checking.

[Leo]

My CSS should do exactly that.

When I added using the browser inspector tool, this is the result:
https://www.screencast.com/t/qM9YsTqf0Pdf

Can you add it in and keep Autopmize off so I can see the issue if it doesn’t work?

[Silvia]

I did it again and now is ok, it looks great. I don’t why I saw differently before. Anyway, now is perfect! Thank you so much Leo!

[Leo]

No problem 🙂

[Author]

Posts