Pure CSS Speech Bubbles

Recently, a Q &A project I was working on had these "speech bubbles" around each user posted comment. The existing code made use of an absolutely positioned image over each div containing a user comment.

That ain't no way to live.

I ended up using a technique Nicholaas Galahger developed to achieve the same effect using only CSS.

Simply apply a single class to the element you want wrapped in a speech bubble, like so:

<p class="triangle-border right">The entire appearance is created only with CSS.</p>

There are a variety of styles to suit many types of application, or money with the CSS yourself, it's straightforward and extremely well-commented.

http://nicolasgallagher.com/pure-css-speech-bubbles/demo/