CSS Teaser Box

Just a little something that may be of use to someone. It’s pretty common for websites to have “teasers” that show an excerpt of a full article or document. The design for a recent project called for a teaser box with rounded corners.

Very simple, but I like the way it uses no extra markup, and will grow (vertically, it has a fixed width) to contain any amount of text. It will also take huge text sizes to break it.

Update: I just realized that the two images can be combined. That’s one less server hit and a few bytes saved on image size.

Posted on June 9, 2004 in CSS