Untitled

dabblet.css

/*final-css*/
.speech-bubble {	
	text-align:center;
	font:40px/100px Arial, sans-serif;
	color:#fff;
	background:red;
	width:300px;
  	height:100px;
  	margin:auto;
  	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
}

.speech-bubble:before {
    content:"";
	position:absolute;
	bottom:-75px;
	top:0;
    left:0;    
    border-color: transparent red;
    border-style: solid;
    border-width:0px 0px 100px 25px;
}

.demo-title {
	width:300px;
  	height:100px;
	text-align:center; 
	margin:auto; 	
  	position: absolute;
	top: 200px; left: 0px; right: 0px;
	font-size:20px;
	color:red;
}

dabblet.html

<!--ash-->
<div class="speech-bubble">@ashtewari</div>


<div class="demo-title">How to create a CSS speech bubble</div>

<div>
Ash Tewari
</br>
http://www.ashtewari.com/
</br>
@ashtewari
</div>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"split-vertical","fontsize":"100","seethrough":"","prefixfree":"1","page":"result"}