ニュース、賞、出版物など、さまざまな長さの縦型ページ ラベルがあります。テキストを同じ最上点から開始し (テキストが水平の場合は右揃えになります)、その点から下に移動したいと考えています。インライン スタイルを使用して、テキストを押し下げて正しい位置に配置する必要があります。高さと幅を 500 に設定しようとしましたが、これは整列には機能しているように見えますが、div を正しい方向に押し上げます。
.vert_text {
position: relative;
color: #fff;
text-transform: lowercase;
font-family: Arial;
font-size: 6em;
-webkit-transform: rotate(-90deg);
-moz-transform:rotate(-90deg);
-ms-transform:rotate(-90deg);
float:left;
width:100px;
}
<div class="vert_text">
news
</div>
<div class="vert_text">
publications
</div>