Ok, my rollover effect are working fine on images whose display is of type "block". But when the display is of type "inline", the image in the background is shifted a pixel or two downwards! Which is frustrating!
Here is the code form the CSS file and the HTML file, respectively:
==HTML File========================================= Bla Bla Bla <a href="one.pdf" id=pdf class=rollDoc> <img src="./images/pdf.gif"></a>  <a href="two.ppt" id=ppt class=rollDoc> <img src="./images/ppt.gif"></a> Bla Bla Bla =================================================