Skip to content

Instantly share code, notes, and snippets.

@jussi-kalliokoski

jussi-kalliokoski/demo.html

Created October 8, 2012 17:00
Show Gist options
  • Save jussi-kalliokoski/3853601 to your computer and use it in GitHub Desktop.
Save jussi-kalliokoski/3853601 to your computer and use it in GitHub Desktop.
Download ZIP
A `position: pointer` demonstration
Raw
demo.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
.tooltip {
position: pointer;
left: 10px;
top: 10px;
width: auto;
height: auto;
padding: 5px;
background-color: rgba(0,0,0,.8);
color: white;
border-radius: 5px;
box-shadow: 0 0 3px black;
}
.tooltipping:not(:hover) + .tooltip {
display: none;
}
</style>
</head>
<body>
<button class="tooltipping">Hover over me for more info!</button>
<div class="tooltip">
Here's some more info!
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment