Utilizing the popular JQuery plugin Cycle for a slideshow on this site: bybyweb.com/pbm
An issue has arisen - everything functions as expected on windows (across all major browsers), BUT on MAC (running lion 10.7.5, tested on one machine so far; unsure of client's OS version on second test machine...) there is an issue...
The problem at hand: the navigation circles are being cut off at the bottom. (you will see it in the slideshow). Confirmed across Firefox, Safari and Chrome!
Relevant css:
#slider_nav {
position:absolute;
width:200px;
height:27px;
z-index:999;
left:392px;
top:455px;
margin:0;
padding:0;
}
.slideli{
width:24px;
height:27px;
padding:0 24px 0 0;
background-image:url(../images/gray-dot.png);
background-repeat:no-repeat;
cursor:pointer;
background-position:top;
margin:0;
}
.activeSlide {
width:24px;
height:27px;
text-decoration:none;
padding:0 24px 0 0;
background-image:url(../images/white-dot.png);
background-repeat:no-repeat;
background-position:top;
cursor:pointer;
margin:0;
}
I've adjusted the height to be larger than necessary, removed margins, paddings... but to no avail - it's clear that something else is causing the issue here, any tips or advice would be greatly appreciated.