puh, I got it ..., it's such a small error, that causes such a problem ;-)
The responsible code for this whole problem is in the style.css:
.avia_tooltip {
background: url("images/shared/arrow_up.png") no-repeat scroll 80px top transparent;
margin: 0 0 0 -84px;
padding: 10px 0 0;
position: absolute;
text-align: center;
width: 180px;
z-index: 1000;
font-size: 11px;
top:0;
left:-9999px;
}
and there - for some reasons, don't know anymore - I have changed the part
padding: 10px 0 0;
to
padding: -10px 0 0;
So the little arrow is not shown and therefor when you move down your mouse, the tooltip disappears ... why ever ...
- - - - - - - - - -
Solution:
So if somebody also needs this boxed layout of mine with a margin-top of 30px, then you need to add to your custom.css for a correct display and function of the social icons' tooltips:
.boxed #wrap_all {
border-color: #A0918A;
box-shadow: 0 0 5px rgba(0, 0, 0, 0.5);
margin: 30px auto;
border-color: #AAAAAA #AAAAAA -moz-use-text-color;
border-style: solid solid none;
border-width: 1px 1px medium;
box-shadow: 0 8px 8px 0 #202020;
}
body .avia_tooltip {
margin: -23px 0 0 -84px;
}
body .tooltip_search_site {
margin: -36px 0 0 -160px;
padding-top: 11 px;
}
Thanks a lot, Kriesi, for your patience, but now it works like a charm :-)