Here's what we are going to be doing in this tutorial:
There are a lot of ways to do message bubbles, so here are some key points to my technique:
- completely image free;
- arrow has smooth edges and shadow;
- graceful degradation in IE7-8;
- always positioned on the center of the source element no matter how wide it is or how much text is in the bubble.