Parallax Image Issue

Shapely
1

Hi guys,

I’m commenting to see if anyone can help me with this issue I’m having. I’m building a website for a personal trainer. I have a featured image on the website using the parallax widget. I love the positioning of the photo on the mobile version of the website, however the positioning of the photo on the desktop version of the website version is completely different, and his entire head is cut off. Does anyone know how to make the positioning of the photo start from the top on both desktop and mobile and have it be consistent positioning on both?

The website is: www.rozefit.com

Thank you so much for your help.

Best,
Emily

2

Also, I want to add that I did try changing the setting to “top”… which works on desktop and mobile, however his head appears way off center on the mobile version when I do this.

Thanks so much.

3

hey there

Hope you are having a good day and thank you for your question :slight_smile:

Please add this CSS in appearance - customize - additional CSS

.bg-dark .back-to-top {
display: none;
}

Thanks!
Colorlib Support Team

4

Hi Noda,

I added this code, however his head is still completely cut off on the desktop version - and on the mobile version he’s still a little off center! So sorry for the inconvenience!

5

Hi there

Sorry, I messed your CSS code :slight_smile:
Please try this one, it should work:

#shapely_home_parallax-2 {
background-image: url(https://rozefit.com/wp-content/uploads/2020/01/unnamed-15-scaled-e1579570715454.jpg);
background-size: cover;
background-attachment: fixed;
background-position-x: center;
}

6

Hi Noda,

Thanks so much for this code!!! It worked!!! :slight_smile:

Best,
Emily

7

Thank you too :slight_smile:
If you’re happy with our service, don’t forget to rate us: [Illdy] Reviews | WordPress.org