Non-Quotidian Problems

Published 16 years, 9 months past

After I published the latest iteration of the reset styles, Paul Chaplin pointed out that my simplification of the quote-suppressing rules actually broke the intended effect in Safari 2, Gecko variants , and so on.  This happened because I assumed support for quotes: none, and it just isn’t there in most browsers.  Apparently, I was testing IN THE FUTURE! that day.

“Well, no problem,” I thought to myself, “I’ll use content: none instead”.  Nope.  Even in browsers that support generated content, support for the content value none appears to have fallen through the cracks.  Using it completely fails to suppress the generation of content, so far as my testing can determine.  Even more amusingly, content: normal prevents the insertion of quotation marks in Camino (and probably other Geckos), but not Safari.

So we’re back to explicitly forcing the assignment of empty content boxes in order to stop the insertion of quote marks: content: '';.  Oh, joy.  Paul had come to the same conclusion, and worked out a nice little fallback set that reminds me of the cursor trick that gets you a hand-pointing icon in both IE and the rest of the world, only his trick is completely valid.  So I’ll be adding that in, along with some thanks to Paul.

For my next magic trick, maybe I’ll base a reset rule on :nth-child() and see what people invent to simulate the intended effect.

Comments (14)

  1. So now I’m curious which browser you were testing in

  2. content: none will be included in Firefox 3 (Gecko 1.9). You may want to test it there.

  3. The content: none seems to be working in Firefox 3 anyway…

  4. For what it’s worth, ‘content:none’ is a relatively recent spec addition; it’s in CSS 2.1 (partly to match future plans for css3) but was not in CSS 2.0.

    (‘quotes:none’ works fine for me in both Firefox 2.0 and in the latest Firefox 3 builds.)

  5. Am I missing something? Why don”t you just use “quotes: '' ''”? That will set the opening and closing quote characters both to the empty string, producing exactly the intended effect. My testing hasn”t been thorough by any stretch, but I”ve had no surprises so far.

  6. Why don”t you just use “quotes: '' ''“?

    Because it’s ignored by Safari 2, just like quotes: none.

  7. Hi Eric,

    I’ve only just replied to your comment on my blog, as I hadn’t seen it until now – apologies for not approving it and replying sooner.

    I was also reminded of the cursor trick – CSS, while imperfect in implementation and arguably spec, can be rather convenient at times, given the way it’s designed. I’m quite entertained by content: normal; behaving differently in what I’d otherwise consider highly standards-compliant engines – I can’t quite decide which interpretation I favour (is there “normative spec” with guidance, I wonder?). Thanks for putting the time in on this.

    @David Baron & Daniel: I discovered the CSS 2.x difference only four weeks ago, when browsing SitePoint’s nice new CSS reference – they had the content property listed as being in both CSS 2 and 2.1, but the none value wasn’t listed, and I was sure I’d seen it elsewhere before (they’ve now added it, after a friendly prod). I’m surprised to hear that Gecko doesn’t support it pre-1.9, though. It seems to work in Konqueror 3.5.8, but not the recent-ish WebKit build I’m using. Thanks for the heads-up.

  8. it”s ignored by Safari 2

    So that”s what I was missing. Well, sigh.

  9. For :nth-child you might look to Alex Bischoff’s Alistapart article Keeping Your Elements” Kids in Line with Offspring, though I didn’t see anything in it about siblings. 8^(

  10. When is the reset.css getting its own URL as your promised Eric!

  11. Well, I keep running into these little snags, Ben. It will happen. (Actually, it already has, but I’m trying to get all the kinks worked out before publishing it.)

  12. Just stop using q tags. That should work. Does anyone benefit from them? Why are quotations any more deserving of a dedicated tag than questions, sentences, clauses, or any other lexical units?

  13. the q tag is html’s semantic answer to an inline quote (as opposed to blockquote). why they have to render with delimiting quotation marks is anybody’s guess. some european countries use different punctuation marks for quotes. so i support eric’s attempt at suppressing the default behaviour.

  14. the q tag is html”s semantic answer to an inline quote (as opposed to blockquote). why they have to render with delimiting quotation marks is anybody”s guess. some european countries use different punctuation marks for quotes

    I think the idea is that browsers should render the appropriate quote marks for their locale. So in theory, in you”re browsing in France, <q> elements should be rendered with the double-arrow-style quotes. I”ve never tested to see which browsers do what.

Add Your Thoughts

Meyerweb dot com reserves the right to edit or remove any comment, especially when abusive or irrelevant to the topic at hand.

HTML allowed: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <em> <i> <q cite=""> <s> <strong> <pre class=""> <kbd>

if you’re satisfied with it.

Comment Preview