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].
I have turned the metaslider caption feature into a call to action button with custom css, but I can’t seem to find the handle to override this to show up on responsive (mobile site). Anyone?
Hi Josh,
Do you have a public URL where we can take a look at how you’ve set things up?
Hi,
URL is http://happybyhaley.com
Hi Josh,
If you navigate to AppearanceCustom CSS, you’ll get our custom CSS editor. Add the following CSS:
.metaslider .caption-wrap { right: 0 !important; bottom: 0 !important; left: 0 !important; margin: 0 auto !important; }Then please remove:
With:
You might also need to install the SiteOrigin CSS Editor.
Sorry I am a bit confused!
I have got the caption converted to the call to action button, which appears on the desktop website. Normally the caption only comes up when you hover with the mouse. So on mobile there is no hover from the mouse so therefor no caption. So am I not looking for the mobile handle to change CSS in there?
Either way
With this
> Then please remove:
>
> left: 1000px !important;
> With:
>
> left: 0 !important; right: 0 !important;
You mean remove the first line and replace with the other two lines?
Hi Josh,
Sorry for the delay.
Oh, you’re right – sorry. I forgot to include the media query. Please add the follow CSS instead:
@media (max-width: 1150px) { .metaslider .caption-wrap { right: 0 !important; bottom: 0 !important; left: 0 !important; margin: 0 auto !important; } }However, the second set of CSS still needs to be added. To answer your question, yes. Replace the first line with the other two lines.