Skip to content

Instantly share code, notes, and snippets.

@kevingorski

kevingorski/dabblet.css

Created April 20, 2012 21:08
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save kevingorski/2431919 to your computer and use it in GitHub Desktop.
Save kevingorski/2431919 to your computer and use it in GitHub Desktop.
Download ZIP
Popover for Neven
Raw
dabblet.css
/**
* Popover for Neven
*/
body {
background-color: #BBB;
}
.container {
width: 250px;
}
.popover {
display: block;
background-color: white;
padding: 1em;
border-radius: 5px;
font-family: "helvetica", sans-serif;
font-size: 0.75em;
margin-bottom:0;
position:relative;
z-index:10;
}
.shadowy {
box-shadow: 3px 3px 25px #555;
}
.tail {
color: white;
font-size: 2em;
text-shadow: 3px 3px 25px #555;
text-align: center;
position: relative;
top: -0.25em;
}
h2 { text-align: center; font-size: 1.25em }
Raw
dabblet.html
<!-- content to be placed inside <body>…</body> -->
<div class="container">
<div class="shadowy">
<div class="popover">
<h2>Can you create this popover in clean, not-too-hacky <abbr>CSS</abbr>?</h2>
<ul>
<li>It's pretty cool</li>
<li>more</li>
</ul>
</div>
</div>
<div class="tail">▼</div>
</div>
Raw
settings.json
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"all"}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment