HTML and CSS Reference
In-Depth Information
a[href$="formula1.com/"] span {
position: absolute;
left: -9000px;
text-decoration: none;
display: block;
width: 250px;
background-color: #006;
color: #FFF;
padding: 10px;
}
a[href$="formula1.com/"]:hover span {
left: 20px;
top: -160px;
}
Figure
11-15
shows how the contents of the
<span>
are displayed when hovering over the link. This is an
example of an absolutely positioned element being displayed outside its containing block.
Figure 11-15.
The tooltip is displayed above the link
