I’m having an issue with the thumb image on Tiny Scrollbar. The top of the thumb image is cut off and not rounded like it should be. Wondering if anyone has any ideas as to what would cause this.
Here is the CSS I am using:
#scrollable { width: 915px; margin: 20px 0 10px; }
#scrollable .viewport { width: 890px; height: 470px; overflow: hidden; position: relative; }
#scrollable .overview { list-style: none; position: absolute; left: 0; top: 0; padding: 0; margin: 0; }
#scrollable .scrollbar{ background: transparent url(../images/bg-scrollbar-track-y.png) no-repeat 0 0; position: relative; background-position: 0 0; float: right; width: 18px; }
#scrollable .track { background: transparent url(../images/bg-scrollbar-trackend-y.png) no-repeat 0 100%; height: 100%; width:18px; position: relative; padding: 0 1px; }
#scrollable .thumb { background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 100%; height: 20px; width: 25px; cursor: pointer; overflow: hidden; position: absolute; top: 0; left: -5px; }
#scrollable .thumb .end { background: transparent url(../images/bg-scrollbar-thumb-y.png) no-repeat 50% 0; overflow: hidden; height: 5px; width: 25px; }
#scrollable .disable { display: none; }