Home › Forums › Free Themes › Construction Base › Background image not responsive
- This topic has 7 replies, 2 voices, and was last updated 6 years, 11 months ago by wensolutions.
-
AuthorPosts
-
December 5, 2017 at 8:11 pm #59773BarretDParticipant
Hello. I’ve tried pretty much almost everything, but so far I haven’t been able to get the background image to show responsively. It shows the top left corner of the image only. I don’t know what else to do. Any ideas?
December 5, 2017 at 11:37 pm #59786wensolutionsKeymasterHello @barretd,
When we tested the theme locally the background image is working fine in responsive view as well.
So can you post your site URL so that we could inspect further??
Hope you understand.
Best Regards!!
December 5, 2017 at 11:46 pm #59790BarretDParticipantThanks for the quick reply. Url is winnipegplumbingheating.ca. I would seriously appreciate anything you can do for me. On the preview within the theme, mobile looks good but when it’s on an actual phone, only the top left of the image is shown (and image is not reduced). Been trying so many things, I think I confused myself. Thanks
December 6, 2017 at 4:06 am #59812wensolutionsKeymasterHello @barretd,
In the responsive view, you cannot view full image as some of the parts get cropped to adjust the image in responsive view.
Currently left part of the image is displayed cropping the other part but if you want to display the center part of the image then you can use below given CSS.
Go to Admin Panel > Appearance > Customize > Additional CSS and paste below given CSS.
body.custom-background { background-position: center !important; }
Hope this helps.
Best Regards!!
December 6, 2017 at 8:18 pm #59877BarretDParticipantThanks for the help. Unfortunately, it is exactly the same as before. Judging by the time I’ve spent on this singular issue, I might be best off changing themes. Unless, you have any other ideas? Thanks in advance.
December 8, 2017 at 7:14 am #60061wensolutionsKeymasterHello @barretd,
When we inspected your site URL the CSS is working absolutely fine. Currently, it displays the background image cropping the center part.
However, if you are fine with displaying full image but in small height then once try using below-given CSS.
@media (max-width: 767px){ body.custom-background { background-size: contain !important; } }
Hope this helps.
Best Regards!!
December 8, 2017 at 11:59 pm #60135BarretDParticipantThanks for the suggestion, but all it did was make the image pretty much disappear. There was a very thin line at the top probably no more than a few pixels high, and then just white space where the image was supposed to be.
I appreciate everything you’re doing to try to help me, but as I am using the free version of the theme, I totally understand if you don’t want to put forth anymore effort in finding the cause of this issue.
If however, you want to continue, I would be open to giving you access to the backend so you could take a deeper look.
Honestly, it’s completely up to you. Thanks very much.December 10, 2017 at 10:39 pm #60258wensolutionsKeymasterHello @barretd,
We would like to apologize for the inconveniences.
But this is how the theme works in responsive view. The image will get cropped and there is nothing much we can do with the background image.
Hope you understand 🙂 .
Best Regards!!
-
AuthorPosts
- You must be logged in to reply to this topic.