How to rotate a <div> 90 degrees?

Question

I have a <div> that I want to rotate 90 degrees:

<div id="container_2"></div> 

How can I do this?

Answer 1

You need CSS to achieve this, e.g.:

#container_2 {     -webkit-transform: rotate(90deg);     -moz-transform: rotate(90deg);     -o-transform: rotate(90deg);     -ms-transform: rotate(90deg);     transform: rotate(90deg); } 

Demo:

#container_2 {    width: 100px;    height: 100px;    border: 1px solid red;    -webkit-transform: rotate(45deg);    -moz-transform: rotate(45deg);    -o-transform: rotate(45deg);    -ms-transform: rotate(45deg);    transform: rotate(45deg);  }

<div id="container_2"></div>

(There's 45 degrees rotation in the demo, so you can see the effect)

Note: The -o- and -moz- prefixes are no longer relevant and probably not required. IE9 requires -ms- and Safari and the Android browser require -webkit-

---

Update 2018: Vendor prefixes are not needed anymore. Only transform is sufficient. (thanks @rinogo)