/* Bubble with an isoceles triangle ------------------------------------------ */
.triangle-isosceles { position:relative; padding:15px; margin:1em 0 3em; color:#000; background:#f3961c;
/* css3 */
-moz-border-radius:10px; -webkit-border-radius:10px; border-radius:10px; background:-moz-linear-gradient(top, #f9d835, #f3961c); background:linear-gradient(top, #f9d835, #f3961c); } /* creates triangle */
.triangle-isosceles:after { content:\"\\00a0\"; display:block;
/* reduce the damage in FF3.0 */
position:absolute; z-index:-1; bottom:-30px; left:50px; width:0; height:0; border-width:15px 15px; border-style:solid; border-color:#f3961c transparent transparent; }

http://nicolasgallagher.com/progressive-enhancement-pure-css-speech-bubbles/

pure css3 speech bubbles

pure CSS speech bubbless

css

CSS