Add margin to right of ‘cart’ on header mobile

Store Design
,
1

540F642F-85C9-4E36-9271-550B11E3C43D.png
540F642F-85C9-4E36-9271-550B11E3C43D.png1284×2778 397 KB

Hi all,

my cart and cart counter are not in view properly on my mobile site. It is not showing up like this when I customise my mobile view on shopify. Does anyone know how to fix this?

url: www.tydejewellery.com

pw: chester

2

@vanessabate - try this css, add it to the very end of your base.css file

@media screen and (max-width:749px){
.header__icon--cart{margin-right: 50px;}
}
3

Hi @vanessabate you can do it by adding this CSS code at the bottom of base.css file in Sale channels > Online store > Themes > Edit code > Assets

.header__icon--cart { margin-right: 0px; }

Result

Screenshot_4.jpg
Screenshot_4.jpg386×343 20.8 KB

4

  1. Check your mobile view settings: Double-check that you have enabled the cart and cart counter to display on your mobile view. To do this, go to “Online Store” in your Shopify dashboard, then click “Themes”. Click the “Customize” button next to your current theme, then click “Mobile View”. Check that the “Cart” and “Cart Counter” sections are enabled and set to display.

  2. Check for conflicting code: If you have added any custom code to your theme, it’s possible that it’s conflicting with the cart and cart counter display. Try disabling any custom code you’ve added and see if that resolves the issue.

  3. Clear your cache: It’s possible that your mobile browser has cached an older version of your site that doesn’t include the cart and cart counter. Try clearing your browser’s cache and reloading the page.

  4. Check for responsive design issues: It’s possible that there are responsive design issues on your site that are causing the cart and cart counter to display improperly. Try using the Chrome DevTools to test your site’s responsiveness and see if you can identify any issues.