Hi,
I'm using some css in order to display a tooltip when I hover on some
links. The tooltip displays the content of the tiddler (these tiddlers are
meant to be short -:) ).
When using this tool from the storyriver, it's ok (see first screenshot).
But when I put this tiddler in the sidebar; the tooltip is masked by the
tiddler in the story river (second screenshot), although z-index is 1000.
Content of the css tiddler :
.tooltip {
color: black;
text-decoration: none;
position:relative;
}
.tooltip:hover {
color: red;
position: relative;
}
.tooltip span
{
display:none;
color:black;
background:white;
// -moz-border-radius:6px;
// -webkit-border-radius:6px;
// border-radius:6px;
}
.tooltip span img
{
float:left;
margin:0px 8px 8px 0;
}
.tooltip:hover span
{
display:block;
position:absolute;
width:500px;
max-height:300px;
text-justify: inter-word;
top:100%;
left:50%;
z-index:1000;
padding:8px;
overflow: auto;
-webkit-box-shadow: 2px 2px 15px 1px rgba(119, 119, 119, 0.5);
-moz-box-shadow: 2px 2px 15px 1px rgba(119, 119, 119, 0.5);
box-shadow: 2px 2px 15px 1px rgba(119, 119, 119, 0.5);
}
My skills are limited on this css stuff and it's mainly copy and paste from
what I find (and understand ?) on some sites.
How could I do to get back these tooltips on top ?
Thanks
FrD
<https://lh3.googleusercontent.com/-XYaC2eoKWGY/Vg_ra0g2MCI/AAAAAAAAAqA/2R5IVPrCnxU/s1600/Tooltip1.jpeg>
<https://lh3.googleusercontent.com/-4M6DNbBrhKA/Vg_si8zw4DI/AAAAAAAAAqM/2l8tjRtWMrc/s1600/Tooltip2.jpeg>
--
You received this message because you are subscribed to the Google Groups
"TiddlyWiki" group.
To unsubscribe from this group and stop receiving emails from it, send an email
to [email protected].
To post to this group, send email to [email protected].
Visit this group at http://groups.google.com/group/tiddlywiki.
To view this discussion on the web visit
https://groups.google.com/d/msgid/tiddlywiki/64bd5912-2dab-4449-973e-b293607e3ccc%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
