How can I reposition the cart and resize the header on my ecommerce site?

Topic summary

Goal: move the cart icon under the logo (centered) and reduce the header’s vertical space.

  • Context: Shopify store sadsociety.fr (password: test). Initial change requested only on mobile; later applied to both mobile and desktop.
  • Iteration: Helper prototyped locally and shared screenshots. OP requested precise alignment (logo and stars centered; star slightly higher). Adjustments were made accordingly.
  • Implementation: Helper provided CSS to paste into theme.liquid (above ) via Online Store > Themes > Edit code > theme.liquid. OP confirmed the cart repositioning works. OP had found cart markup in header.liquid; helper clarified CSS placement remains in theme.liquid.
  • Further change: OP clarified “header border” means reducing spacing between header and body on both desktop and mobile (less reduction on mobile). Helper supplied a merged CSS replacement that keeps the cart under the logo and reduces header spacing, instructing OP to replace the previous code.

Status: Cart repositioning solved and live. Header spacing reduction provided via new CSS; awaiting OP’s final confirmation. Screenshots were central to alignment decisions.

Summarized with AI on January 17. AI used: gpt-5.

Is this for mobile or desktop? Or both?