I saw this topic here: First lowercase the text then capitalize it. Is it possible with CSS?
But it wasn't pure CSS. I have a div that contains this text:
<div> RaWr rAwR </div>
I want to use css to make it look like "Rawr Rawr". Cut if I just to text-transform capitalize it makes it "RaWr RAwR", the already uppercase letters remain upper case. So I need to lower case it all first then capitalize, is the solution to wrap it in a div?
I tried wrapping it in another div but it didnt work:
<style> #test3 { text-transform: lowercase; } #test3 div { text-transform: capitalize; } </style> <div id="test3"><div>RaWr rAwR</div></div>
Text-Transform Values uppercase makes all of the letters in the selected text uppercase. capitalize capitalizes the first letter of each word in the selected text. none leaves the text's case and capitalization exactly as it was entered. inherit gives the text the case and capitalization of its parent.
capitalize − The first letter of each word in the element's text should be capitalized. uppercase − All of the characters in the element's text should be uppercase (capital letters). lowercase − All of the characters in the element's text should be lowercase.
This should do it when you have the single words in different div's
#test3 { text-transform: lowercase; } #test3::first-letter { text-transform: uppercase; } <div id="test3">haLLo</div>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With