CSS for my ZoomHandlers as shown -

i have css zoomhandlers shown

.zoomhandle { width: 10px; height: 55px; }

please see image of zoomhandlers on chart here http://www.tiikoni.com/tis/view/?id=74ce68f

what want have , left , right arrow marks on left , right zoom handlers on , shown here

http://www.tiikoni.com/tis/view/?id=bab7819

i have tried adding background-image:("test.png"); , did not got shown

any ideas ??

here solution. css sprites

you ask how?in tutorial see how can display part of large image tell zoom

<ul id="container"> <li id="image"></li> </ul>  <style type="text/css"> #container{ position:relative; width:400px; height:200px; background-image:url("background.jpg"); overflow:hidden; }  #image{  position:relative; width:1024px; height:200px; left:-100; } </style> 

and can have 2 button , jquery increase or decrease left position of #image