CSS

How to convert all text to uppercase using CSS

Written by Ian Carnaghan · 19 sec read >

If you have text within a div tag that you want to convert to Uppercase you can achieve this using the CSS text-transform property that was introduced in CSS1

E.g.

You want to convert 

<div>
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
</div>

to  

<div>
LOREM IPSUM IS SIMPLY DUMMY TEXT OF THE PRINTING AND TYPESETTING INDUSTRY.
</div>

to do this we assign the text-transform: uppercase;  css property to the div tag’s styling 

div {
     text-transform: uppercase;
}

Last Updated On March 22, 2018
Written by Ian Carnaghan
I am a software developer and online educator who likes to keep up with all the latest in technology. I also manage cloud infrastructure, continuous monitoring, DevOps processes, security, and continuous integration and deployment. Profile

Leave a Reply

avatar
  Subscribe  
Notify of