IE Won't Display Formatting of Custom Tags

I use Mozilla 1.4a almost exclusively for my general browsing needs.
I'm working on a blog and am playing around with CSS a bit. Things
were looking quite nice in Mozilla, and I didn't think to check
whether the page looked okay in IE. Then a friend told me that some
of my formatting didn't show up, and I'm at a loss as to how to fix
it.

IE6 handles all the standard CSS tags properly; it's the one's I've
made up myself that it doesn't do right. For example, I have the
following set up to format dictionary entries:

.blogPost asha{font-weight:bold;}
.blogPost eng{font-style:italic;}
.blogPost ipa{font-family:monospace;}

And:

<p><asha>foreign word</asha> <ipa>[pronunciation]</ipa> <eng>English
translation</eng></p>

This works perfectly in Mozilla -- the foreign word is bold, the
pronunciation is monospaced, and the English is italicized. IE shows
no formatting at all. How can I fix this?

Thanks!


--
AA

*Evertjan.* <exjxw.hannivoort (AT) interxnl (DOT) net>:

Arthaey wrote on 08 jul 2003 in comp.infosystems.www.authoring.stylesheets:

p><asha>foreign word</asha> <ipa>[pronunciation]</ipa> <eng>English
translation</eng></p

This works perfectly in Mozilla -- the foreign word is bold, the
pronunciation is monospaced, and the English is italicized. IE shows
no formatting at all. How can I fix this?

Probably by using some specialised XML application instead of HTML.

.asha{font-weight:bold;}

span class="asha">...</span

More appropriate, in theory, would be the 'lang' or 'xml:lang' attribute and
the ':lang' pseudo-class, though. (If "asha" is a language.) Perhaps a table
or definition list is also a better approach.

<dl>
<dt lang="asha">foreign word</dt>
<dd lang="ipa">[pronunciation]</dd>
<dd lang="en">English translation</dd>
</dl>

or

<table>
<tr><th lang="asha">foreign word</th>
<td lang="ipa">[pronunciation]</td>
<td lang="en">English translation</td></tr>
</table>

Note that "ipa" is not a valid language code according to ISO 639, but is
used for example by MPEG 4. It's probably better to use it as a suffix to
the transcribed language ("asha-IPA") or mark it as of personal use
("x-IPA"). The required CSS rules would differ in both these cases.
I've no idea what "asha" may stand for, so I left it in unmodified. Google
says the American Speech-Language-Hearing Association is abbreviated so.
You may of course alternately use the three letter code "eng" instead of the
two letter one "en" for English.

:lang(asha) {font-weight:bold;}
:lang(en) {font-style:italic;}
:lang(ipa) {font-family:monospace;} /* I doubt this was a good choice. A
font with IPA characters should already be in a reasonable style. It's not
very likely a user has a full IPA font at all, even less a monospaced one.
*/

I'm not aware of any working implementation of ':lang()'. A less powerful,
less exact alternative, that isn't supported by IE<6 and NS<4 either, would
be to use attribute selectors:

[lang|=asha] {font-weight:bold;}
[lang|=en] {font-style:italic;}
[lang|=ipa] {font-family:monospace;}

For XHTML 1.1 and /real/ XHTML 1.0 you would have to change the colon to
pipe in the CSS (only proposed yet IIRC):

[xml|lang|="asha"] {font-weight:bold;}
[xml|lang|="en"] {font-style:italic;}
[xml|lang|="ipa"] {font-family:monospace;}

All variants /should/ work the same with the universal selector "*" added at
the beginning.

--
"It is not worth an intelligent man's time to be in the majority.
By definition, there are already enough people to do that."
G. H. Hardy