Recently I have been contacted quite a bit asking how to float the Soliloquy Lite Responsive Slider Pager Buttons Vertically on the right. I decided to write this post and record a video to share with everyone. Watch the video or follow the instructions below.
Step 1
Open up your stylesheet. Locate your Media Queries section or Responsive Design section. You will want to paste your code right above this area. If you cannot find one of these areas in your stylesheet, scroll all the way to the bottom, hit the return key a couple of times to start a new line and this is where you should paste your code.
Step 2
Click “View Raw” on the Gist below. Select all, copy and paste the code in the stylesheet position you located above. Then save it.
That’s it.
https://gist.github.com/cre8tivediva/c5ff4b05bc5768fbfabe2d780f99d2df
**Note: Depending on how many images you have in your slider, you may or may not need to adjust the percentage on Line 25. On a recent project, I have 7 images which resulted in having a larger space between the last button and the bottom of the image. The pager buttons were no longer centered vertically. Changing 50% to 40% fixed this problem and the buttons were then centered.
If you have any caching plugins installed, clear or delete your cache first. Then visit the front of the site and refresh your screen. You should see the pager buttons floating off to the right vertically.
I hope you find this useful.