Skip to content

Instantly share code, notes, and snippets.

@Keats
Created December 25, 2013 00:09
Show Gist options
  • Save Keats/8119002 to your computer and use it in GitHub Desktop.
Save Keats/8119002 to your computer and use it in GitHub Desktop.
Css Bubble
$red: #C91F2C;
.bubble {
position: relative;
width: 60px;
height: 60px;
text-align: center;
font: 25px/60px Arial, sans-serif;
color: white;
background: $red;
}
.bubble:before {
content: "";
position: absolute;
bottom: -30px;
right: -15px;
border-width: 0 30px 30px 0;
border-style: solid;
border-color: transparent $red;
}
.bubble:after {
content: "";
position: absolute;
bottom: -30px;
left: 60px;
border-width: 0 15px 30px 0;
border-style: solid;
border-color: transparent white;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment