Hi, I’ve seen some 3-4 yr old threads on this issue so wondered if there were any updates. Using the SO Hero image (Corp theme), I would like the image to scale down otherwise it literally takes up the entire vertical screen of the phone! I thought I could add a max-width: 100% in the CSS Mobile section of the widget but that hasn’t worked.
Is there any update on this issue? Or any additional CSS I can use to fix the problem?
Thank you!
Hi Charlie
Thanks for posting your question.
The Hero offers FitText which resized heading tags for mobile. As a whole though, the Hero wasn’t designed to use a background image size of 100% which requires the height and contents of the Hero to scale. We have recently added a Mobile Height setting which in conjunction with FitText is helpful. If the combination of FitText and Mobile Height isn’t enough, you could perhaps give Smart Slider 3 a try. Alternatively, if you don’t need text layering, you could use the SiteOrigin Slider widget which offers normal image resizing. The Slider widget does offer a foreground image option but doesn’t offer text layering. Let us know how it goes. Feel free to send a link if you’d like us to take a look.
Thank you Andrew.
For sure. If any follow-up questions arise, please, let us know.