How can I increase the space between my page and header?

Technical Q&A
1

Hi everyone,

I have an issue with the space between the transparent header and the page. First heading appears in the header. I already tried some codes from the forum wihout success. Below the picture:

header.JPG
header.JPG779×187 7.94 KB

Can anyone help?

Many thanks in advance!

2

Hello,
please share your site url.

3

https://usa.hech.com/

4

Add this css at the bottom of
Online Store->Theme->Edit code->Assets->timber.scss.css

.template-collection .main-content .wrapper {
    margin-top: 150px;
}
.template-product .main-content .wrapper {
    margin-top: 150px;
}
.template-page .main-content .wrapper {
    margin-top: 150px;
}

@media only screen and (max-width: 749px){
.template-collection .main-content .wrapper {
    margin-top: 70px;
}
.template-product .main-content .wrapper {
    margin-top: 70px;
}
.template-page .main-content .wrapper {
    margin-top: 70px;
}
}
1 Like
5

hello @blossom2

please Go to Online Store->Theme->Edit code then go to assets/theme.css ->paste below code at the bottom of the file.

.template-collection .main-content .wrapper , .template-product .main-content .wrapper ,.template-page .main-content .wrapper {
    margin-top: 120px !important;
} 
@media only screen and (max-width: 749px){
.template-collection .main-content .wrapper  , .template-product .main-content .wrapper , .template-page .main-content .wrapper{
    margin-top: 70px !important;
}
6

Unfortunately it didn´t worked.

7

hello @blossom2

can you please share screenshot of assets folder in which file to add code

8

code.JPG
code.JPG368×416 19.2 KB

9

Thank you so much! It worked now :slightly_smiling_face: