Snippets → CSS
CSS Tooltip
Simple tooltip in full CSS.
a:hover { background:#ffffff; text-decoration:none;} /*BG color is a must for IE6*/
a.tooltip span {display:none; padding:2px 3px; margin-left:8px; width:130px;}
a.tooltip:hover span{display:inline; position:absolute; background:#ffffff; border:1px solid #cccccc; color:#6c6c6c;}
Easy <a class="tooltip" href="#">Tooltip<span>This is the crazy little Easy Tooltip Text.</span></a>.
Source: http://www.kollermedia.at/archive/2008/03/24/easy-css-toolti...
This is great! It works well and if you change the cursor on hover you add to the effect.
the Tooltip is nice and easy….but the problem is that it does not position itself according to browser window…
for instance:– if the link is on the right side of the screen the tool-tip goes out of window and thus becomes almost hidden.