リストタグで縦書きした時に中央寄せする

2022 6/03

2022年6月3日 2022年6月3日

writing-modeってやつで縦書きになるんだけど、中央寄せがなかなかうまくいかないので。

こんな感じで中央寄せできる。

<style>
.text-center {
  text-align: center;
}

ul.vertical {
  writing-mode: vertical-lr;
  display: inline-block;
  text-align: left;
}

ul.vertical li {
  display: block;
}
</style>

<div class="text-center">
  <ul class="vertical">
    <li>テキスト</li>
    <li>テキスト</li>
    <li>テキスト</li>
  </ul>
</div>

<style>

.text-center {

text-align: center;

}

ul.vertical {

writing-mode: vertical-lr;

display: inline-block;

text-align: left;

}

ul.vertical li {

display: block;

}

</style>

</ul>

</div>

よかったらシェアしてね！

URLをコピーしました！

URLをコピーしました！

この記事を書いた人

ore

リストタグで縦書きした時に中央寄せする

この記事を書いた人

関連記事