Sent by Ben Meadowcroft on 11 April 2002 07:07
Hi
First post to the list, I am just wondering if anybody has much experience
dealing with quotes and CSS. The question I have is that, I am using images
included using the content property as my quote marks and I was wondering if
there was a more elegant way of describing how deeply nested quotes are
dealt with.
My current CSS is
*[lang|="en"] q:before { content: url("openquote.gif");} /* I want to find a
better way of specifying this set of rules, to arbitrary nested levels*/
*[lang|="en"] q:after { content: url("closequote.gif");}
*[lang|="en"] q q:before { content: url("opensinglequote.gif");}
*[lang|="en"] q q:after { content: url("closesinglequote.gif");}
What I would like is some way of using the quotes property to specify what
images to use, however I believe this property only accepts strings not
URLs. I would therefore appreciate any help on techniques that could be used
to deal with deeply nested quotes (and block quotes) in an elegant fashion.
I have put up a test url at http://www.benmeadowcroft.com/webdev/test/ so
you can see what I am doing. This url is my testing ground for a few ideas
though, so visiting it in Mozilla and Opera, will reveal at least a couple
of things one browser supports and the other doesn't and vice versa ;-) The
quotes bit is at top though.
I know using images as quotes will not work in many browsers (IE 6 and Opera
6 for starters, judging by my tests) but I am doing this on my personal site
for the heck of it. Oh yes, I know the quote images are pretty lame, but I
am only using them for testing, I expect to be using something a bit funkier
looking by the time I've got the stylesheets up to scratch.
regards,
Ben Meadowcroft
http://www.benmeadowcroft.com/webdev/