For those designers who want to do the fancy-pants block-quotes thing, here is the CSS. Note that you have to put a DIV element in there to give it padding and close the quotes. That’s because the current specification for CSS do not allow for more than one background image for any single element. This may change in the future, but for now, we must write fairly non-semantic markup in order to achieve the cool effect.
blockquote {
background: transparent url(path/to/quote-left.img) left top no-repeat;
}
blockquote div {
background: transparent url(path/to/quote-right.img) right bottom no-repeat;
padding: 0 50px;
}
… And this is what it looks like:
I used to be really, really humble.It just made me big-headed.
x jeremy jarratt
I added a :hover behavior to mine. What will you do?
