ansaurus

Question

Why does the <link> ‘title’ attribute cause browsers to ignore my styles?

Answer 1

+17 A:

The HTML 4.0 spec states that there are three kinds of stylesheets: persistent, preferred, and alternate.

A stylesheet is "persistent" if it is linked with rel="stylesheet" and has no title attribute. All persistent stylesheets are used when rendering.
A stylesheet is "preferred" if it is linked with rel="stylesheet" and has a title attribute; preferred stylesheets with the same title are grouped together, but there should not be more than one group. It seems browsers will choose just one preferred stylesheet to render since there should be only one.
Finally, a stylesheet is "alternate" if it is linked with rel="alternate stylesheet" and has a title. These stylesheets are supposed to allow the user to choose stylesheets, they are grouped together by title and show up in the browser's stylesheet selector if it has one (View >> Page Style in Firefox). Each group (by title) is mutually exclusive.

By putting title attributes on your stylesheets, you're unwittingly making them into preferred stylesheets rather than the expected persistent stylesheet. This is also why they work when they all have the same title.

Neil Williams 2009-12-24 22:46:39

Nice answer. Thanks!

Andres Jaan Tack 2009-12-24 23:10:20

Answer 2

A:

Read this: http://blogs.telerik.com/dimodimov/posts/08-05-15/title%5Fattributes%5Fin%5Fcss%5Flink%5Ftags%5Fprevent%5Fstyles%5Ffrom%5Fbeing%5Fapplied.aspx

I have been aware for some time now that title attributes in CSS tags trigger problems and prevent some CSS styles from being applied on the web page. Today I invested a couple of hours in finding out what actually happens and this is what we've got.

If you have several tags in the page and one of them has a title attribute, then the tags coming after it must either have a title attribute with the same value or no title attribute at all, otherwise the styles in the latter CSS files the will not be applied on the page.

The issue can be easily reproduced in various versions of Firefox, Opera and Safari. The only browser, which does not exhibit the unexpected behavior is Internet Explorer.

Really weird o.o

Andreas Bonini 2009-12-24 22:50:52

Answer 3

+1 A:

Following up on Neil Williams' answer:

Authors may specify a number of mutually exclusive style sheets called alternate style sheets.... User agents should allow users to select from alternate style sheets.

(emphasis added)

Also:

To make a style sheet preferred, set the rel attribute to "stylesheet" and name the style sheet with the title attribute.

This is from http://www.w3.org/TR/REC-html40/present/styles.html#h-14.3.1

Asher Dunn 2009-12-24 22:54:26

Answer 4

A:

It took me about 3 hours to get to the end of it, as I was adding a new stylesheet include. I thought I had some conflicts between present CSS rules and the ones I was adding. After running out of sane options, I tried removing the title tag from the link. I didnt think much of it, thought it was some useless metadata. Well, it turned out this was what was preventing the CSS from being parsed. Turns out the stale committee of brainfart CSS standards came up with this. Couldn't they just have added a new attribute that is clearer, for their preferred and whatnot functionality (whatever the heck it's supposed to do) instead of relying on the presence or absence of the title attribute? I lost all that time that should be invested in doing something productive. During my search, I promised myself that I would take measures once I find the origin of this problem. Now, remains to decide on the measures.

Rolf 2010-06-24 19:36:40

Sorry for putting this as an answer, for some reason I cant comment on answers above.

Rolf 2010-06-24 19:49:47

ansaurus

tags:

views:

answers:

Why does the <link> ‘title’ attribute cause browsers to ignore my styles?

related questions