modifying font in DHTML tooltip

[wordsistr]

I have been playing with both DHTML tooltips (the cool one and especially the second one with the arrow pointer:http://www.dynamicdrive.com/dynamicindex5/dhtmltooltip2.htmnumber

Basically, I want to have a white font, but I have had no consistancy in changing its colour, size or style. To the initial css code, I have added standard things like:

#dhtmltooltip{
position: absolute;
left: -300px;
width: 150px;
border: 1px solid black;
padding: 2px;
background-color: c0c0c0;
font-family: sans-serif;
font-size: 8px;
color: ffffff;
visibility: hidden;
z-index: 100;
/*Remove below line to remove shadow. Below line should always appear last within this CSS*/
filter: progid:DXImageTransform.Microsoft.Shadow(color=gray,direction=135);

Does the order these are listed make a difference? My webpage started reflecting my changes to the font in the style sheet, but then it got stuck and would never change again. this is my webpage (http://www.pret-a-lingo.com/email/cartoons/test1249_end.htm)
I have an external CSS sheet already attached...is this complicating matters?

And one more question...where do I specify the path to the pointer image I stuck in my image folder? (arrow2)

Thanks for all of your help!

[charlesbucket]

You can do the change the old-fashioned way (with the FONT tag) when you write your tips out:

ONMOUSEOVER="ddrivetip('<FONT color=ffffff>This DIV has a tip!!.</F>', 250)";

Just make sure and change the bg color in the header script to a dark color, or the text won't show up.

[wordsistr]

And there's the rub...there's no such thing as old fashioned for me in this field! Thank-you so much for your help. If any newbies (like me) want to see the tooltip code I used, this is it: <a href="#"onMouseOver="ddrivetip('<Font color=ffffff font face=Georgia font size=2>My tip in <em>italics.</em></F>', 260)"; onMouseOut="hideddrivetip()">tip</a>

(this works so I presume it's right....)

As for the arrow, there is a place in the code to define the path to the image on your website...there's even a comment in grey that tells you exactly where to "write out pointer image" and you can put your "./images/arrow2.gif" (or whatever) right there. And one other note, if you fill the tooltip with a colour in the style sheet at the top, you have to manually fill in the arrow image with the same colour in something like Photoshop. Also, if you change the border to be bigger than 1 px (mine is: border: 1px solid #a3c062;) (the happy face is a semi colon!), you will see it cut across under the arrow. I imagine there is some way to fix this, but I have no idea.

This is an image of my final tooltip. Quite lovely I think! (though I don't know for how long I'll keep this image in my folder!)

http://www.pret-a-lingo.com/images/my_tip.gif