Possible to use Header without background image & padding on first page only?

andersgahlin · September 2015

I'm trying to reduce the padding on the first page between the header and the page content but I can't seem to get it to work. I can switch on the "minimalist" option but that removes it globally and I only want to do this on the first page.

Is this possible?

Thanks

Albert · September 2015

If you want to do this on one page only, then you can do this with custom css. If you will send us url to page where you want do this, we'll show you how.

andersgahlin · September 2015

Thanks - http://www.gaahlin.com/alron/

Albert · September 2015

Ok. So to remove content padding from this page only, please use below css:

.page-id-54 #Content { padding-top: 0 !important; }

andersgahlin · September 2015

Perhaps I'm doing it wrong or was unclear in my wish but I used the custom CSS on the page in question but there is no change. I would like to have the background graphics go up behind the menu right to the corner. I can get this by turing on the minimalist option but then all other layouts becomes wrong since I want the padding on the other pages.

To show what I would like, if possible is to go from this (see screenshot)

to this (see image)

My apologies for being unclear.

Albert · September 2015

Ok. So to do something like that, please use below css:

.page-id-54 #Content { margin-top: -60px !important; }

If above value won't be enough, then increase this -60px value.

andersgahlin · September 2015

I worked when I used the value -160 but it also created a problem where it broke the responsive interface now lost half it's menu and logo in the top. If I turn this around, is there a way to turn on the minimalist option for the first page only? Or turn it on globally and pad the other pages. Not sure what is best but I know that turning on the minimalist option works for the first page at least.

Albert · September 2015

For responsive version it won't be possible. So what you can do is set this css for desktop devices only. And this can be done with below css:

@media only screen and (min-width: 1240px) {
    .page-id-54 #Content { margin-top: -160px !important; }
}

And this is all you can do in this case.

andersgahlin · September 2015

Thanks a lot, that seems to do the trick

Albert · September 2015

You're welcome

andersgahlin · September 2015

To put t simply, the code stopped working. What did I do wrong?

http://www.alron.se

Albert · September 2015

What stopped working exactly? We tried to open your site but we can't. There is password.

andersgahlin · September 2015

Oh, you were that fast. I removed the password just after I posted this. The padding that you helped me remove came back and I seem to have missed something in my import of the code.

Albert · September 2015

Looks like you change page ID and that's why above css does not work. The code we gave you above is per page. Your old page id was 54 but now is different.

andersgahlin · September 2015

Ah, obviously. Ok, thanks. Then I know I just need to change the page ID. Thanks again.

Albert · September 2015

You're welcome

Possible to use Header without background image &amp; padding on first page only?

Comments

Possible to use Header without background image & padding on first page only?