Close your Blockquotes, Google!

I wrote the nice folks at Google Adwords this morning after taking a look at their blog. They have a nice fancy blockquotes all over their posts, but they aren’t closing it. That bothers me. Where does the quote end? Is it the entire post? Oy. If you’re going to open a quote, you need to close a quote, right?

If you’re going to open a blockquote, make sure you close the blockquote!

This is accomplished through a little CSS trickery. You apply the open quote on your blockquote tag and then put a div in your blockquote that applies the closing quote.

Here’s the HTML:

>blockquote>>div>This is my blockquote>/div>>/blockquote>

Here’s the CSS:

blockquote {

  background: transparent url(images/openquote.gif) left top no-repeat;

}

blockquote div {

  background: transparent url(images/closequote.gif) right bottom no-repeat;

}

Voila!

Note: I owe credit to this tip to Simon Willison’s Weblog.