Paul
Paul

Reputation: 1004

CSS Style Issue with Content Slider Pointer

I am trying to modify a JQuery Content Slider that Im currently using to have the Thumb pics appear at the bottom instead of appearing at the side:

Here is the current Content Slider that has the Thumb Pics on the side: http://jsfiddle.net/NinjaSk8ter/6WXkM/ enter image description here

This is my implementation where I have moved the Thumb Pics at the bottom: http://jsfiddle.net/NinjaSk8ter/QaLg2/

As you can see the problem is that my Arrow Pointer has dissappeared. Does anyone know why is this occurring?
enter image description here

Upvotes: 0

Views: 145

Answers (2)

Terry
Terry

Reputation: 66123

The reason why it's not working the way you wanted it to be, is simply because the first image of the bottom bar is placed in a separate parent element, while the rest of the images in the bottom bar is placed under an second parent element.

I have made some changes to your file. Try checking it out here again: http://jsfiddle.net/teddyrised/5tXgQ/3/

On a side note, I don't recommend wrapping the <a> in an unnecessary <div> element. They could be floated without the help of a wrapper <div>.

Upvotes: 1

Maybe you modify its style="border-color: black; border-style: solid; border-width: 1px;"

Upvotes: 0

Related Questions