Parallax melting with content

Hi there,

Not exactly sure which part you are referring to but does this help?
https://docs.generatepress.com/article/page-hero-examples/

Let me know :)

Hi,

Thanks for the reply and sorry for not being clear. Please take a look at the image following image
https://hemtips.se/wp-content/uploads/2018/10/example-image.jpg

This is the style I'm trying to achieve. I want part of a header image to be behind the product table :)

Any ideas or further questions? :)

Should be doable.

Can you set the header image first then I can give you some CSS?

Thanks!

I'll update this reply with another URL that is a post and slightly different in a minute - if it's not possible on this one.

https://hemtips.se/testa1/ (page - contained width)
https://hemtips.se/2018/10/05/draft/ (post - full width)

I don't see a header on testa1.

But for draft, I assume you will will hide the entry header (title author etc)? then you try CSS like this:

@media (min-width: 769px) {
    .entry-content {
        margin-top: -200px;
    }
}

Is there a specific reason to use post instead of page? Just curious....

Let me know :)

Thank you, getting there! Is there a way to make sure it looks good on all devices? By using margin-top, the content box will move up. Not using px would maybe be optimal if there's a solution, otherwise I'll have to make a lot of @media designs.

No specific reason for post/page, just thought it might make it easier for us to find a solution :)

https://hemtips.se/testa1/

I guess you could try using % instead of px?

I find using % makes the height of the screen hard to deal with but you can definitely try.

Alright thanks, let me know if come across another solution please :)

Those are basically the only 2 common solutions.

You will have to test it out and view it on multiple device to see which one will suit you the best :)

Glad I could help!