How to set background image to fill header

Store Design
1

Hi all,

I’d like to know if it is possible for my background image to fill the entire space including the header ?

My site is www.herbaldimensions.com

pw: leasho

Please let me know if this is possible.

2

Hi @HerbalDimension ,

Please Go to Online Store->Theme->Edit code then go to assets/theme.css

Find below css code

.site-header__outer-wrapper {
    top: calc((var(--header-logo-height-mobile) + 0.375rem) * -1);
    background-color: #fff;
    z-index: 900;
}

Remove Line

background-color: #fff;

I age will show in header background.
Thanks

1 Like
3

Thanks! Having trouble finding the code. I am in theme.css.liquid. Is this correct? Is there a way to search for a line of the code?>

4

Yes, theme.css.liquid is correct.

Now try to find

.site-header__outer-wrapper
1 Like
5

using Cntrl + F doesn’t bring up:

.site-header__outer-wrapper

There are 10,000 lines of code there. Currently unable to locate…

6

Found this eventually:

.site-header__outer-wrapper {
top: calc((var(–header-logo-height-mobile) + 0.375rem) * -1);
background-color: {{ settings.background-color }};
z-index: 900;

1 Like
7

remove or comment this line only

background-color: {{ settings.background-color }};
8

removed:

background-color: {{ settings.background-color }};

Works,

Thanks!

1 Like
9

Please accept and like the solution.

10

Hello I have 2 Websites.
On the first one it worked. I found the header-wrapper code in my theme.liquid.
But on my second website I cannot find the same code on the same theme.liquid page.

Did Shopify changed anything or cna you help me?