Notice: This thread is over two years old; the information may be outdated. Please consider creating a new thread if you require free support. If you have an active SiteOrigin Premium license, you can email our premium support desk at [email protected].
Hi there,
I have the Hero Slider which is great however the first image I have is responsive and reduces down well on a mobile device but the second doesn’t – it shows up as huge and very zoomed in.
You wouldn’t have any initial thoughts as to why that could happen?
Thanks
Tim
Hi Tim
Thanks for reaching out.
In the second slide you’ve used inline CSS to add padding to each paragraph. Ideally you need to use a class for each paragraph and then use Custom CSS so you can drop the padding on smaller screens.
And then at Appearance > Custom CSS”
@media (min-width: 1024px) { .450-padding { padding-left: 450px; } }Thanks Andrew, that seems to have been the problem, I have deleted the text now and the associated inline CSS.
Glad to hear you’ve made progress :)
Do remember that you can’t/should not start css class selectors with numbers…
“”In CSS, identifiers (including element names, classes, and IDs in selectors) can contain only the characters [a-zA-Z0-9] and ISO 10646 characters U+00A0 and higher, plus the hyphen (-) and the underscore (_); they cannot start with a digit, two hyphens, or a hyphen followed by a digit. Identifiers can also contain escaped characters and any ISO 10646 character as a numeric code (see next item). For instance, the identifier “B&W?” may be written as “B\&W\?” or “B\26 W\3F”.””
W3C Specification