Created
April 30, 2012 20:29
-
-
Save pixleight/2562427 to your computer and use it in GitHub Desktop.
CSS Speech Bubble
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/** | |
* CSS Speech Bubble | |
*/ | |
html { | |
background: #EEE; | |
} | |
.wrap { | |
width: 960px; | |
margin: 0 auto; | |
} | |
.speech-bubble { | |
border-radius: 10px; | |
padding: 10px; | |
background: #FFFFF0; | |
position: relative; | |
z-index: 1; | |
} | |
.speech-bubble:after { | |
border-color: #FFFFF0 transparent; | |
border-style: solid; | |
border-width: 15px 15px 0; | |
bottom: -15px; | |
content: ""; | |
display: block; | |
right: 50px; | |
position: absolute; | |
width: 0; | |
} | |
.speech-bubble p:before { | |
content: "“"; | |
float: left; | |
font-size: 2em; | |
margin: -.1em 0.25em 1em 0; | |
color: rgba(0,0,0,0.25); | |
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<div class="wrap"> | |
<div class="speech-bubble"> | |
<p>Lanham Blackwell made my claim process go so smoothly. Their professionalism and attention to detail really helped in representing me in a class action litigation. They made this process so easy – all I | |
had to do was submit the requested documentation and they took care of | |
the rest. I was very pleased with not only with the service of Sam | |
Lanham and the staff of Lanham Blackwell, but with the outcome of my | |
case!</p> | |
</div> | |
</div> |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
{"view":"split","fontsize":"100","seethrough":"","prefixfree":"1","page":"css"} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment