| Inherited | Initial | Version |
|---|---|---|
| Yes | none |
CSS1, 2 |
| IE5.5+ | FF1+ | SA1.3+ | OP9.2+ |
|---|---|---|---|
| Buggy | Full | Full | Full |
Syntax
Description
This property controls if and how an element’s text content is capitalized.
Example
These style rules make
h1 headings use only uppercase letters, while the first
letter of each word in h2 headings will be
uppercased:
h1 {
text-transform: uppercase;
}
h2 {
text-transform: capitalize;
}Value
capitalize- transforms the first character in each word to uppercase; all other characters remain unaffected—they’re not transformed to lowercase, but will appear as written in the document
lowercase- transforms all characters to lowercase
none- produces no capitalization effect at all
uppercase- transforms all characters to uppercase
Compatibility
| Internet Explorer | Firefox | Safari | Opera | |||||||
|---|---|---|---|---|---|---|---|---|---|---|
| 5.5 | 6.0 | 7.0 | 1.0 | 1.5 | 2.0 | 1.3 | 2.0 | 3.0 | 9.2 | 9.5 |
| Buggy | Buggy | Buggy | Full | Full | Full | Full | Full | Full | Full | Full |
Note that the concept of what constitutes a word depends on the language in which the content is presented, and differs between browsers. Opera and Firefox will capitalize text-transform as Text-transform, while Internet Explorer for Windows will capitalize it as Text-Transform.
In Internet Explorer for Windows
versions up to and including 7, the values lowercase
and uppercase behave like none
if the font-variant property is set to
small-caps.
Internet Explorer for Windows versions up to and
including 7 don’t support the value inherit.
User-contributed notes
Add a note
To post a note on this topic, please log in with your SitePoint username and password. If you don't have an account yet, you can create a new account for free.