Failure of specific tags

[ferren]

Two tags, <cite> and <sup>, suddenly fail to work across 6 browsers under Mavericks. This suggests that all browsers call on a system file to interpret HTML. <i> still produces italics; other vertical-positioning tags work, so if there is a corrupted file, it is quite specific. Is re-installation of OS X the logical fix, or is there a simpler approach?

[dsonesuk]

Could be css styling of parent element overriding the default <cite> <sup> tag styling.

[ferren]

Good shot! I disabled my long and confusing CSS file, and both <sub> and <cite> started working again (even if the result is deformatted and ghastly). So now I recursively disable half the CSS file to isolate the offenders.

 

Problem solved. Some helpful web guru's tutorial explained that it was always best to start with a reset, and provided a long template--including <sup> and <cite>. After removing this, <sup> and <cite> worked once again. The odd thing is that they worked for a long time with the reset in place, making me think that it was indeed some change at the W3C level that caused the change of behavior. Or a passing alpha particle.

Edited August 8, 2015 by ferren

[Ingolme]

The browser developer tools will allow you to see what selectors are affecting the style of an element.

[ferren]

Ah so; a whole world of largely incomprehensible help!

 

Is this (turfed up Firefox - Tools - Web Developer - Inspector - html- Rules) an example of 'selectors affecting the style of an element'? It does suggest a certain mutability behind the scenes which could account for an inexplicable change of behavior.

table {  writing-mode: horizontal-tb !important; /* XXX remove when bug 1077521 is fixed */  display: table;  border-spacing: 2px;  border-collapse: separate;  /* XXXldb do we want this if we're border-collapse:collapse ? */  box-sizing: border-box;  text-indent: 0;}

The tools appear to be Firefox specific, at least to some degree. I recently moved my web development to Firefox from Opera because Firefox displays &vltri; and (apparently alone among browsers) understands 'scoped' and Syrian fonts. Is there a book which might explain the dozen tools and hundreds of options that Firefox offers? I hesitate to buy tech books without being able to peruse them, having several times bought books from the web that sounded helpful but weren't. (I know of no useful bookstores between the Pyrenees and England except for a couple in Amsterdam, and I won't get to Boston until September.)

[Ingolme]

I'd just press F12. It opens the developer tools in which you can just click on an element to see a list of styles applied to it and styles it has inherited.