Center-aligned title in rev slider starts off-center

Support
#1

I have a slider that has centered title text, but when the slider initially loads, the titles are all to the right. Then - when the slides cycle, they’re fixed. Reload the page, and it starts anew. Any ideas? Thanks in advance!!!

website: https://joelhager.com/sites/love/

#2

Hi There,

Please take a look at these articles to setup your layer position:

https://www.themepunch.com/revslider-doc/layer-styles-positioning/

https://www.themepunch.com/revslider-doc/slide-layers/#position-layers-inside-grid

Hope it helps :slight_smile:

#3

It’s correct. Cycle through and it fixes itself.

#4

Glad to hear that :slight_smile:

#5

No. I will clarify:

When you initially load the page, the text isn’t centered. When the slides cycle through, it fixes itself. When it initially loads though, it’s off. You can check it here >> https://joelhager.com/sites/love/

#6

#7

Hey @jrhager84,

Would you mind exporting your slider and put the zip file in a file sharing service like Dropbox so we could download and install it in our test site and so we could test it?

For now, a quick a solution to this would be to force the layer to permanently stick to the left side so it remains in place. Right now, it relies on Slider Revolution’s layer position calculation which might be affected with some settings.

Insert this code in the Custom CSS of your slider. See http://www.themepunch.com/faq/custom-css-or-javascript-for-version-5-0/ for usage instruction. Implemented correctly and provided there are no syntax errors with all your custom CSS (if applicable), the code should work. See the screencast in the secure note.

.tp-parallax-wrap {
    left: 0 !important;
}

Thanks.

#8

I’ve attached the slider to my original post. Thank you. :smiley:

#9

The solution you posted throws of the static layer arrows I have on the site.

#10

I’ve imported the slider in my test site but I got the slider templates issue.

Looks like you have enabled this feature that is not available or was removed in X. In this case, we can’t replicate your setup on our end so you will need to use the CSS solution.

Sorry if I missed to see the next/previous button. To target the carousel only, please use:

.tp-carousel-wrapper .tp-parallax-wrap {
    left: 0 !important;
}

That code should work now. See the secure note.

Hope that helps.

#11

Wait - you’re telling me the post slide template is removed? I did nothing extra other than what came with my license. I’m not sure how I could have enabled something that wasn’t in X when the very install was in X. I’ll apply the CSS though. Hopefully I can get some clarification on what feature you’re specifically talking about. Thanks!

#12

So, the issue I’m having is this:

Technically, the code does work. Well, it throws the button off, but I just threw a :not(".rev-btn") selector on the query, and it works. The issue is it works when you apply, not on page load. So when you refresh the page, it’s off-center again. So in theory it works, but in practice it does nothing at all to fix the issue. I hope that makes sense.

#13

In this case, please give us WordPress Admin access in a Secure Note so we could see your actual setup and try to manually replicate it to see if there’s a proper setting or if this is a bug.

Thanks.

#14

I’m gonna attach the credentials to this post:

#15

Hi There,

I was unable to login to your website. I got this error message:

Could you please double check?

Thank you.

#16

You just have to retry. You’ll get in after the first time. It’s a server bug I’m working on. Just retry and it’ll let you in.

#17

Hi There,

I’ve double checked your slider setup and everything seems to be ok.

To fix this issue, I’ve added this custom CSS under Slider Settings > Custom CSS:

.my-post-title {left: 0 !important;}

Regards!

#18

That’s weird. Is there any reason why when I added that CSS to Theme Options CSS it doesn’t work, but does inside the Custom CSS panel in Slider Rev?

It does fix it though, so thank you!

#19

It could be that the code that is added to the Rev Slider’s custom CSS gets a higher priority than the Theme Options’ CSS or there might be an issue with the CSS code that you have in the Global CSS such as some CSS syntax error that is stopping the CSS code you are adding to work as expected.

To verify that, please copy all the codes that are in the Global CSS and paste it here.

It should provide some information if there are any CSS error that is causing the issue that you have to fix so that the CSS codes will work.

Hope this helps.

Cheers!

#20

Just warnings for using !important to override settings, and then adjoining classes for IE6 support (which I don’t care about). No errors though. Just warnings.