I have my site complete and it looks beautiful on desktop. But I’m having a few issues with the mobile version I can’t figure out how to fix.
On the page, clearpathalerts.com/totality, I have an image of runners set to full width background, parallax and center/center. The mobile version doesn’t parallax which I can live with, but the image isn’t centered and it’s hard to tell what’s going on. How can I get it centered in the background?
Yes, you can get it centered. This is the only way to cover all text of that section with the image in mobile. Because if we’d set the image to be responsive, it would cover only the title of the section. It would become that small.
Please try adding this code into your custom css box:
@media (max-width: 979px){
.section-style.parallax_section {
background-position: center center !important;
}}
I changed the media width to 480px and added the same code into the page’s custom css box. This is how it looks on mobile now: https://postimg.org/image/xa0q0tmxn/ (i removed the overlay only from inspect element, in order for the screenshot to be more clear).
Let us know.
