div css垂直怎么横过来,CSS3：垂直对齐的多个旋转div

我有三个或更多div，我想旋转并垂直对齐它们。我尝试过，但没有找到解决方案。

的CSS：

.rotation {

float: left;

clear: both;

width:100px;

}

.rotation .container {

float: left;

clear: both;

}

.rotation .rotate {

float: left;

margin-top: 20px;

-ms-transform: rotate(90deg);

/*IE 9*/

-webkit-transform: rotate(90deg);

/*Chrome, Safari, Opera*/

transform: rotate(90deg);

transform-origin: 50% 50% 0;

background: #3c8d37;

color: #fff;

font-family:arial;

}

HTML：

First Text

Long Text Long Text

Very Long Text Very Long Text

我正在尝试做这样的事情：

文字长度可能因文化而异，我希望保持所有div对齐。那可能吗？我感谢任何帮助。