Accessibility

CSS Advisor

font-variant: small-caps and text-transform

by CSSAdvisorAdmin on November 1, 2006
Edited by: LoriHC (Dreamweaver Team) on September 11, 2010
Avg Rating 4.0 (2)   |   Log in to rate post.

Tagged with font-variant , Explorer 6.0 , Explorer 5.0 , text-transform , Explorer 5.5 , Explorer for Mac

Problem

Using "font-variant: small-caps" causes "text-transform: uppercase || lowercase" to be ignored.

Solution

Alas, there is no standard for fixing this bug.

Detailed description

If you assign a value to the following property in your CSS:

.will-render { font-variant: small-caps; }

... Internet Explorer will subsequently ignore either of the following properties in your rendered page:

.wont-render-1 { text-transform: uppercase; }
.wont-render-2 { text-transform: lowercase; }

Bug originally submitted by ppk on Quirksmode.org

A somewhat obscure workaround - massaging the markup by way of innerHTML, has also been suggested by Krijn Hoetmer (read article).




Text ID: FONT_VARIANT_TEXT_TRANSFORM



Comments (0)

To add a comment, please Log in.








CSS Advisor home
Submit a post

rss

CSS ADVISOR RSS FEEDS
Recent: POSTS | COMMENTS | EDITS


Browsers
Internet Explorer (103)
Mozilla/Firefox (52)
Opera (18)
Safari (38)
CSS Properties
Background (25)
Border (10)
Color (10)
Float (23)
Font (6)
Margin (11)
Padding (9)
Position (40)
Text (30)
Width/Height (27)