Background featured image not positioned properly
srcek opened this issue · comments
Background dynamic featured image doesn't seem to position itself according to settings (Position, Attachment, Repeat, Size). Instead, it positions itself to default settings.
Thank you.
I'm seeing the same issue, the "Cover" option is not working for me. It shows up correctly in the editor, but not on the live post.
Elementor Single post template editor:
https://www.dropbox.com/s/bqrjl0tj6kid9pv/single-post-template.png?dl=0
Live post:
https://www.dropbox.com/s/miwodx0cbyb05d2/live-post.png?dl=0
I can confirm that several options of the dynamic background is not behaving the same as with static.
Hi,
Same issue here.
It's good in preview but not in front-end.
Thx
Please update.
I am using:
Elementor 2.0.15 and Elementor Pro 2.0.10. I have a background-image set to dynamically use the post featured image in my blog post template. This used to work and now background-image does not get set anymore, although I see the image appear when editing the page with Elementor. Even the preview works, but not the real page.
Did this feature get broken recently?
Happening to me too, it was working then I just changed a global font used in that section and it messed up the section background settings, it was on cover no-repeat and now on live it shows as defaults (repeat). It shows ok on the editor, so no idea what to do to fix it.
This is happening to me as well. I have avoided using this feature because of this bug. I have a page template where the featured image is used as a section background set to COVER and NO-REPEAT, yet the image is not covering and is repeating. I originally had this issue about a year ago and I just decided to change my design because I couldn't find a fix, now I tried to do it again on another site and it's still a bug. This really needs to be fixed.
Using latest version of Elementor and E Pro on Hello theme.
I have the same issue. This is ridiculous. How can this be open for two yeas?
I set a static background image: it works (cover, no-repeat)
I change a font in a title ==> the background image suddenly repeats in x- and y-direction
This is happening to me as well. I have avoided using this feature because of this bug. I have a page template where the featured image is used as a section background set to COVER and NO-REPEAT, yet the image is not covering and is repeating. I originally had this issue about a year ago and I just decided to change my design because I couldn't find a fix, now I tried to do it again on another site and it's still a bug. This really needs to be fixed.
Using latest version of Elementor and E Pro on Hello theme.
Been going back and forth with Elementor on this. They keep saying they cannot repeat the issue on their end, yet it happens every time for me on all my browsers. Elementor support stopped responding over a week ago, I have followed up twice. Will post the fix if they ever give me one.
PLEASE FIX THIS
This is still an issue. Happening sometimes only though. Cannot relate to plugin conflict.
EDIT
Works with the new flex containers
For anyone who needs it, I did find one solution on another forum.
--------SOLUTION--------
Put this in the custom CSS of the section you have the featured image background on:
selector { background-size: cover; background-attachment: default; background-position: center center; background-repeat: no-repeat; }
(Just change it to fit your needs, i.e. background position: center left/center right, background-size: cover/contain etc.)
This totally fixes it for me, though Elementor still absolutely needs to fix this obvious bug. Unbelievable they havn't fixed it for over 2 years.
Hope someone can find this useful, here's the original forum where I found it:
https://www.reddit.com/r/elementor/comments/p6yz5s/single_post_template_unable_to_format_the/
So great to have a fix for this after battling it for so long, thankyou!
I found that setting the image in all three, Desktop, Tab and Mobile, Fixes it
I think I just experienced the same problem.
I was trying set a background image on a section to Position "Center Center" only on Tablet and Mobile views.
It did not work when leaving the Desktop Position "Default".
The fix I found was to set Desktop Position to something other than "Default". In my case I set the Desktop Position to "Top Center" and then the "Center Center" started working on Tablet and Mobile views.
I can confirm I've had this issue many times and I still have it, even with the latest versions of Elementor.
What it fixes it for me (only temporarily) is going to Elementor > Tools > General > Regenerate CSS & Data. This fixes it, but it eventually breaks again and you have to repeat it.
I'm having the same issue. This Issue was opened almost 6 years ago ... It's good that we can tackle it with a workaround but at some point it should be fixed.
I come from the future and the problem is still in version 3.23.1
fix (put this css code in the container) thanks @Jamesbinda !
selector {background-size: cover; background-attachment: scroll; background-position: center center; background-repeat: no-repeat;}
It happens randomly.
I tried regenerating css, disabling special features, leaving only ACF/Elementor as enabled plugins and nothing fixes it except the css code above.
We need an official fix!