如何在div中垂直一一对齐文本？

Question

I need to create a fixed menu button which would be assigned to the right side of the browser. Currently i my code looks lie this:

#button-side-menu {
    background: none repeat scroll 0 0 #F5F5F5;
    border-radius: 5px 5px 0 0;
    color: #363636;
    height: 28px;
    position: fixed;
    right: 16px;
    top: 91px;
    z-index: 2000;
    -moz-transform: rotate(270deg);
    -o-transform: rotate(270deg);
    -webkit-transform: rotate(-90deg);
    -moz-transform-origin: 100% 100%;
    -o-transform-origin: 100% 100%;
    -webkit-transform-origin: 100% 100%;
    padding: 10px;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

Is it possible to center it in the div, the text was not adhered to the right side. And also is it possible to set test like this:

M
e
n
u

PS Site is multilingual so i need the text, not image in this case.

Answer 1

This works:

#button-side-menu {
    background: none repeat scroll 0 0 #F5F5F5;
    border-radius: 5px 5px 0 0;
    color: #363636;
    width: 15px;
    position: fixed;
    right: 16px;
    top: 91px;
    z-index: 2000;
    word-wrap:break-word;
    text-align: center;
    padding: 10px;
    font-family: "Helvetica Neue",Helvetica,Arial,sans-serif;
}

Important: word-wrap and text-align are added to make it look like what you asked. Its width is fixed to 15px instead of height.