Nav buttons on bottom inside of slider are off-center (nopC 2.6)

Hi,

Nav buttons on bottom inside of slider are off-center and I do not see how to change the position of them. THere is no code or .css entry that I can find.

Could there be a way to allow this to be controlled by .css? My ultimate goal is to be able to adjust this to the left, right or perfectly centered.

Thank you in advance for your help.

Hi,

Which navigation buttons you are referring to. As you can see on our demo the circles are centered on the bottom of the slider inside it.

Ultimately you can control them by modifying the

".theme-navigation-inside .nivo-controlNav" css class from the ~/Plugins/SevenSpikes.Nop.Plugins.AnywhereSliders/Themes/{ThemeName}/Content/nivo/skins/navigation-inside/navigation-inside.css file.

Hope that helps!

Hi,

Thanks for your reply. I was speaking of the "circles" as you refer to them. But -- oh my, am I embarrassed - I never even looked in the "skins" folders for additional .css files. My bad. There it was and clearly marked in the .css file as well. Changes worked perfectly! Thank you!

May I ask one additional question? I have changed the type of circle (enlarged it a light bit) and would like to put a number in each of the circles. Do you have any tricks or tips? I can figure it out eventually (e.g. the hard way), just looking to save some time.

Thanks again for your prompt assistance!

RJM

Hi RJM,

By looking at the css we noticed that there is a text-indent style that moves the numbers away. You can simply remove it and then play with the css to ajust the "circles" and the a text sizes and positions, so that they can fit one into another.

.theme-navigation-inside .nivo-controlNav a {
  display:block;
  width:22px;
  height:22px;
  background:url(bullets.png) no-repeat;
  text-indent:-9999px;
  border:0;
  margin-right:3px;
  float:left;
}

Hope this helps!

Best Regards,
Nop-Templates Support Team

Hi There!

THanks so much for your reply - you guys do a great job! I am sorry for my late response. I guess in theory your answer seems simple enough to achieve, but I just couldn't get it to work at all. I played with it for a while. Were you able to get something close? I couldn't even see the numbers no matter what I did. If you get get something close, please post and I'll pursue it from there.

Thanks again for your help.

Best regards,

RJM

Hmm. Are you saying the when you remove the text-indent property it doesn't show the numbers? That is strange as if you open our demo site in Chrome and remove the text-indent the numbers 1 2 .. are shown.
http://demos.nop-templates.com/

Many thanks

You are absolutely correct. I will investigate some more. Thank you for your prompt assistance!!  - RJM

Aha! Here's the problem... In the slider settings, I had the box for "Enable using thumbnails for control navigation" checked, even though I didn't have any thumbnails below the slider. As soon as I unchecked it, the numbers appeared.

Thank you once again for your help!

thanks very much!