How to move the header logo to the extreme left and cart icon to the extreme right on desktop view

Store Design
, , ,
1

I want to move the header logo to the extreme left and cart icon to the extreme right on desktop view

site link - www.swawe.store

2

Hi @attackon ,

You can follow these steps to move the header logo to the extreme left and the cart icon to the extreme right on the desktop view

  1. Open Online Store > Theme > Edit Code

  2. Find and open the base.css (or theme.css, custom.css, styles.css) file

  3. Paste the code snippet below to the bottom of the file and hit save

header.header {
    max-width: 100%;
}

Here is the result on desktop view

BSSTekLabs_0-1719048181951.png
BSSTekLabs_0-1719048181951.png2850×1588 260 KB

Hope this helps you solve the issue.

Please don’t forget to Like and Mark it as an Accepted Solution if you find this helpful. Thank you!

3

Hello @attackon
Go to online store ---------> themes --------------> actions ------> edit code-------> base.css
and add this code at the very end of your file.

@media (min-width: 990px) {
.header {
padding: 0 !important;
max-width: 100%;
}
}

also add this code to center the navigation menu

@media screen and (min-width: 990px) {
    .header--middle-left {
        grid-template-areas: "heading navigation icons";
        grid-template-columns: auto auto 0fr;
        column-gap: 2rem;
    }
}

and the result will be

17.png
17.png1920×455 53.9 KB

If you find this helpful, please like and mark the job as completed.
Thanks

4

worked like a charm! thank you!