CSS:フルスクリーン(全画面)に縦書きで中央寄せレイアウト(for Firefox)

.box  {
/* 全画面表示 */
width: 100vw;
height: 100vh;
display: flex;
}

span {
text-align: center;
/* 中央寄せ */
position: relative;
top: 0;
left: 25%;
transform: translateX(-75%);
/* 文字を縦書き */
-webkit-writing-mode: vertical-rl;
-ms-writing-mode: tb-rl;
writing-mode: vertical-rl;
}

Firefox quantum(59.0.2)で確認済み。

コメントを残す