Vertically center rotated text with CSS

Question

I have the following HTML:

    
Centered?

div.

Answer 1

It may be a bit late for answering that question, but I stumbled on the same issue and found some way of achieving it, by adding another div in the way.

    
Centered?

and applying a text-align: center on that middle element, along with some positioning stuff:

.middle {
    margin-left: -200px;
    width: 400px;
    text-align: center;
    position: relative;
    left: 7px;
    top: 50%;
    line-height: 37px;
}

The .inner also gets a display: inline-block; to enable both rotate and text-align properties.

Here is the corresponding fiddle : http://jsfiddle.net/CCMyf/47/