Return to Snippet

Revision: 27435
at June 8, 2010 07:22 by rwczippy


Initial Code
/* 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; }

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

Initial Description
pure css3 speech bubbles

Initial Title
pure CSS speech bubbless

Initial Tags
css

Initial Language
CSS