Still testing those blockquotes
Inspired by the comments on my last entry I decided to try out their techniques with some multiple paragraphs. Since my technique was only ever aimed at single quotes, I welcome the new suggestions.
I really love the display: list-item idea that Pete Lambert but I have been avoiding last-child because of browser compatibility issues.
First I tried multiple quotes with the paragraphs displayed as list items and list-style-position: inside; the problem with that is that the second bottom right quote to display correctly without extra markup. Naturally it is not possible to have the display set as list item - to get both images appearing per paragraph - together with the display inline - to get the second quote make snuggled amongst at the end of the text.
So, just for fun I made it look nice with the constraints of no extra markup, not the same look or idea admittedly but the padding and list-style-position outside are more consistent than the first attempt.
The only way to make it resemble the first ‘one paragraph - inline image quotes - effect is to add an extra div containing each paragraph, yeah its nasty, I know. The div is set to display list item with list-style-position as inside, the paragraph is display: inline with the background image.
It could be argued that logically each paragraph should not have their own quote marks, if this is the case there are a number of methods that you could use, either Ben’s last child technique or Simon’s similar, background image technique from a while back, which again requires extra markup.
As ever the technique you choose all comes back to the design, and what you want to do with it.
This would be a good time to use the DOM to plug the holes in CSS support.
James Wheare - November 22nd, 2006 at 5:53 pmIt’s coming along nicely, Nat.
One thing I’ve always been led understand about blockquoting with multiple paragraphs is that only the final paragraph should have a close quote, while all paragraphs have the opening. If anything, perhaps that rule would make the CSS easier…
Ben Ward - November 23rd, 2006 at 10:22 amYeah I guess that gramatically speaking for multiple paragraphs you should have only one ending quote and perhaps also only one starting quote. To be honest I really just wanted to try out the technique as an experiment on multiple paragraphs :)
natbat - November 24th, 2006 at 12:15 pmthis is nice ^^ i might steal your code ;) thanks ^^
qureyoon - November 24th, 2006 at 11:13 pmNice work.
I partially agree with Ben’s approach, but think that only the first paragraph should have an opening quote, and only the final paragraph should have a close quote.
Looked at Ben’s site and search for a post on the last-child technique, but couldn’t find it.
Michael Montgomery - December 20th, 2006 at 4:29 pmAny pointers?
Thanks.