CODEWITHSUNDEEP
htmltextoperacsstext-styling
weaponx
weaponx

Reputation: 145

text-transform: full-width doesn't work in Opera - html

<div style="position: relative; left: 30px; top: 20px; width: 200px; height: 30px; border: solid 1px black; text-align: center; vertical-align: middle; line-height: 30px; text-transform: full-width;">
<span style="color: #999999; font-family: tahoma; font-size: 12px; text-transform: full-width;" onmouseover="this.style.color='#000000';" onmouseout="this.style.color='#999999';">Example Text</span></div>

http://jsfiddle.net/CQwbQ/

So I have some text inside of div, and I've noticed that text-transform doesn't have effect in Opera (it works normally in Firefox). I have the latest Opera version.

I tried all combinations - putting text-transform: full-width; in span, than in div, than in both...

How can this be fixed?

Upvotes: 0

Views: 572

Answers (1)

Jukka K. Korpela
Jukka K. Korpela

Reputation: 201866

The text-transform value of full-width is currently supported by Firefox only. You could submit a bug report to Opera, but since the value is defined in a Working Draft level document only (CSS Text Module Level 3), I don’t think it would get much attention.

Workarounds:

1) Add a piece of JavaScript code that replaces ASCII characters by corresponding fullwidth characters (e.g., “A” by U+FF21) in applicable parts of the content.

2) Do the same replacement server-side or with preprocessing. More robust.

Upvotes: 3

Related Questions