How to adjust cart location in DAWN theme on mobile devices?

Store Design
, , ,
1

I want to change the location / adjust it on mobile devices for it to look properly aligned from left and right,

Store: shopbreakthrough.com

4r.png
4r.png402Ă—665 28.7 KB

2

Hi,

  1. Go to online store
  2. Edit Code
  3. Open your base.css file
  4. Paste the following code:

@media only screen and (min-width: 768px) {
.header__icon–cart {margin-right: -2.5rem !important}
}

  1. Save.

Let me know if it work by marking it as a solution.

3

Didn’t work after I pasted in base.css, any idea why?

4

Hi @thevergreenlana

Try this one. I decrease a bit.

  • From your Shopify admin dashboard, click on “Online Store” and then “Themes”.
  • Find the theme that you want to edit and click on “Actions” and then “Edit code”.
  • In the “Assets” folder, click on “base.css, style.css or theme.css” file, depending on which file your theme uses to store its CSS styles. At the bottom of the file, add the following CSS code:
@media only screen and (max-width: 749px){
.header {
    padding: 0px 1rem 0px 1.5rem !important;
}
header-drawer {
    padding-left: .8rem;
}
}

But if you really like to take all the space. Try this one, same instruction.

@media only screen and (max-width: 749px){
.header {
    padding: 0px !important;
}
header-drawer {
   padding-left: .8rem;
}
.header__icons {
   padding-right: 0rem;
}
}
5

This is perfect!! Worked like a charm!

6

Thank you, Please dont forget to hit Like if my post helped you.