IBlog<Johan>

This and that in a developer's life in general

News

Follow johandanforth on Twitter

Random Links

Walkthroughs and Tutorials

Stylish Quotes in Blog Posts

I found a few CSS tips and tricks to format (in my view) prettier quotes in your blog posts. For example:

This is a quote.


For the above, I added this CSS:

blockquote {
  background: transparent url(quoleft.png) left top no-repeat;
}

If you want to add a closing quote to it as well, add this:

blockquote p {
  padding: 0 48px;
  background: transparent url(quoright.png) right bottom no-repeat;
}

If you use <P> inside the quote, you may get additional quote signs, so use a couple of <BR /> instead.

Comments

joeriksson said:

Looks great! Would it be possible to the the PNG files?
# June 9, 2006 12:50 PM

joeriksson said:

Sorry, my last comment missed a word. What I wanted to say was: Would it be possible to get the PNG files?
# June 10, 2006 7:24 PM