How to convert all text to uppercase using CSS

H

How Can We Help?

How to convert all text to uppercase using CSS

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;
}

About the author

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.

About Author

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.

Follow Me