Brooklyn theme: Put Custom Logo to Far Left of Screen (need it to scale with various screen sizes)

Store Design
1

Hi, I previously used a margin to make my logo go all the way to the left. I found out that on my screen it looked normal, but on smaller monitors, the logo was cut off all the way to the left and barely visible. How can I make my logo go all the way to the left and scale it to various screen sizes? URL is https://a-lineage-story.myshopify.com/. Password is ‘beckew’.

adthai_1-1634523333285.png
adthai_1-1634523333285.png1895×393 721 KB

1 Like
2

@adthai

you have added unnecessary code please revert and let me know so i will give full screen code

3

I have been working on the site for awhile, so I am unsure which line of code may have been unnecessary.

4

yes you have just revert code and fullscreen code that it

5

Ok, I believe this was the code that I needed to get rid of. What do I do now?

adthai_0-1634534539518.png
adthai_0-1634534539518.png335×135 2.82 KB

1 Like
6

@adthai

yes please remove and let me know

7

It is removed now

1 Like
8

@adthai

great thanks

can you please confirm

KetanKumar_0-1634537292648.png
KetanKumar_0-1634537292648.png1920×1080 511 KB

9

yes, that looks great

10

@adthai

thanks for confirm yes please add this code

  1. Go to Online Store->Theme->Edit code
  2. Asset->/theme.scss.liquid->paste below code at the bottom of the file.
nav.grid__item {
    position: relative;
    right: 0;
}
.site-header__logo img {
    margin-left: 0;
}
.site-header .wrapper {
    max-width: 100%;
}
11

it works great for desktop, however my mobile is not centered anymore. do you know how to fix this? thank you!

1 Like
12

@adthai

thanks can you please show me mobile issue image so i will guide you