CSS pullquote (no tables) ideas...

[D856C]

You've no doubt seen and developed many CSS ideas, so why not the lowly pullquote? I'm talking about something similar to the old table-based layout -- with dispropotionate start and endquote IMG's. This however would be CSS.

Here's what I'm playing around with....

Standard element blockquote, background-image: with the starting quote image (squote.jpg for instance). Then a class .pullquote with the ending quote image (equote.jpg). Seems to work okay, and many layout benefits. What I'm looking for are alternatives. Any ideas would be appreciated. Please include the reasoning behind your approach.

(I would have put this in the layout section, but this seems more CSS scripting)

[D856C]

Very good. Thank you.

[D856C]

Drats, spoke too soon:

Before and after, I thought, might work. However, the GIFs appear on the line above and below blockquote text. I thought to try the following form in order to change the relationship to the principle "box," but to no effect:


blockquote:before {
display: marker; content: url("sq.jpg");
}
blockquote:after {
display: marker; content: url("eq.jpg");
}


While I like this form, I haven't yet got the hang of it.