Docs

[Yan]

Dear Sir/Madam,

I am having the following problem with the tabs and revolution slider:

There are three tabs and there is a revolution slider in each one. The
first time the page is loaded the next and previous arrow are shown
correctly vertically centered while if you click on the second or third
tab the arrows are shown on the top of the slider. You could see this
in the screenshots attached in my dropbox link shared.

https://www.dropbox.com/sh/2a7qjbfvq77n60x/AACRImREf2Q5BgYDQAjwgXzOa?dl=0

Thank in advance.

[Paul R]

Hi Yan,

Thanks for writing in! To assist you with this issue, we’ll first need you to provide us with your site URL as stated on the forum entrance page. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[Yan]

This reply has been marked as private.

[Cousett]

The arrows were positioned correctly in my test could you verify that they are still having issues and perhaps give us some information on the browser you are using? You might also try clearing your cache and disabling caching plugins if you have any enabled.

[Yan]

hi
Go please to this link:
http://www.lafourcheteedesmata.gr/gallery

[Christian]

Hey Yan,

The arrows are centered in the three tabs on our end. Please give us details what and version number of the browser and OS you’re using.

Thanks.

[Yan]

Did you play with tabs and the arrows remain centered? in the address i gave you.
if yes this is wired i tried with a lot of different pcs
I am using latest chrome and windows 8
also a mac
regards

[Zeshan]

Hi Yan,

Thank you for writing in!

Upon testing on Windows 8 on Chrome latest version, I am able to replicate the issue. However, if you click on the slider arrows, it will be fixed. The reason of this issue is that, by default the closed tabs are set to CSS display: none property and because of that the height of the slider is automatically set to 0px, so, as the slider arrows are positioned dynamically according to the height of the slider so these are positioned 0px relatively from the top of the slider and that is why the arrows seemed to be in top when you switch the tabs but as soon as you click them, the arrows will be positioned correctly.

In other words, this issue will occur if you use sliders in tabs, and as the Revolution Slider is a 3rd party plugin, we don’t have much access to it’s script. However, you can try adding following code under Custom > CSS in the Customizer to override the position of the arrows:

.page-id-223 .tp-leftarrow, .page-id-223 .tp-rightarrow {
   top: 50% !important;
}

Hope this helps. 🙂

Thank you.

[Author]

Posts