Remove global css on certain pages

Hi,
Due to my header and certain page elements being hidden behind it (such as titles) I have added the following global css to add a margin to the top of the page:

.x-main.full {
margin-top: 100px;
}

In saying this I don’t want this margin to exist on particular pages such as the home page.

Can you please let me know how I can remove the global css on specific pages. Thank you!

Hi There,

Please provide your URL in order that we can help.

Thank you

the url is www.bbclub.com.au

As you will see on this home page I would like the first section to reach all the way to the top so the image is sen under the transparent header.

Thanks so much.

Hi,

In that case, please remove the css code in your global CSS.

You only add it to the pages where you need it.

You can add it under Edit Page > Pro builder > Settings > CSS

That way it will only affect that specific page.

Thanks

Thank you for your suggestion, however there will end up being so many pages to do this not to mention every single blog post, individual recipe page the list will go on and on… Once the site is done there will be over a 2000 pages thismargin (css) will need to be on.

There is really only 3-4 pages that I will NOT need this Css. Is there an easier way please?

I look forward to your response.

Thank you! :slight_smile:
Naomi

Hi again, I have just resolved this myself… don’t know why I didn’t think of it earlier. I just added it’s own css to each page I do not want the margin on. Thank you!

Hi there,

Glad that you have managed to fix the issue :slight_smile:

1 Like

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.