I’m trying to change the sizing of my header background image for mobile view. (It’s not really the “header” but a background image for a row containing a cta button…)
I’ve tried different plug-ins & css to help, checked and tested every setting, but I’m not having any luck.
I’ve found others asking for help with similar issues, but those solutions haven’t produced the desired results either.
The page I need help with: [log in to see the link]
Thanks for contacting us, sorry you’re having issues with the background image on your site. The background image is set from the Customizer, and only part of the image will show on mobile. We recommend changing the background setting to “Cover” in the Customizer to see if that produces the desired results.
Setting the background to “cover” has the complete opposite effect I want for the mobile view of the website. When set to “cover,” the image is so zoomed in… that there are no details of it being an image at all…
As far as invisible text, I’m not sure what you would be referring to.
Thanks for the updates, I’m sorry to hear you’re still having trouble. I took another look at your site, and also replied to your post on the boldgrid.com support forums. Here’s that reply:
It looks like most of the issues are being caused by some strange negative margins on some of your blocks. I can’t say for sure how these happened, but here’s how you can fix it.
Each one of your blocks that has the negative margins are using the value margin-left: -250px;. Edit your homepage, and switch over to the Text editor tab.
Then use the shortcut Ctrl-F (Cmd-F on a Mac) to search for -250px and use those highlighted sections to locate all of the affected blocks. Once you find those, replace all the negative values with 0px.
That should resolve the issues both with your background image, as well as the “heading” images on the page.