The Arcive of Official vBulletin Modifications Site.It is not a VB3 engine, just a parsed copy! |
|
#1
|
|||
|
|||
CSS tooltip help
I'm using the following in the extra CSS section of a style to create tooltips.
Code:
a.info{ position:relative; color:#C0C000; text-decoration:none; z-index: 24; } a.info:hover{ background-color:#111111; color:#CC0000; z-index: 25; } a.info span{ display: none; } a.info:hover span{ display: block; position: absolute; top: 10px; left: 0; width: 24em; padding: 5px; margin: 10px; z-index: 100; border:1px solid orange; background-color:#000000; filter:alpha(opacity=90); -moz-opacity:0.9; opacity:0.9; color:#C0C000; text-align: left; } HTML Code:
<a class="info">text<span>tip</span></a> I have been trying to make the tooltips be variable width (fit contents) rather than fixed, but if I remove the width attribute or do width: auto; then every tooltip is very narrow (about 56px). They also float _behind_ tcat and thead elements of vB tables, and I need them to be on top. Played with the z-index values and can't figure out where it's wrong. |
#2
|
||||
|
||||
The z-index thing doesn't seem to be a problem on my vanilla 3.7b4 board. I embedded your example tip into the FORUMHOME tcat header, and it displays properly.
Offhand the only way I can think of having the width work the way you want would be to use "width: auto; white-space: nowrap;", but this will only work if your tooltips are all short enough one liners that they don't walk off the page. -- hugh |
|
|
X vBulletin 3.8.12 by vBS Debug Information | |
---|---|
|
|
More Information | |
Template Usage:
Phrase Groups Available:
|
Included Files:
Hooks Called:
|