さわらび明朝の縦書きのレイアウト崩れ

Question

前提・実現したいこと

フォントはさわらび明朝を使用。

writing-mode: vertical-rl;を指定して、縦書きにすると、
レイアウトが崩れてしまいます。

漢字部分が重なってしまっており、ひらがなについては正常に表示されます。

解決策はあるでしょうか？

発生している問題・エラーメッセージ

該当のソースコード

<h2>私たちの文章文章文章ですですです</h2>

body {
  color: #fff;
  background-color: #1F1D1D;
  font-family: 'Sawarabi Mincho', sans-serif;
}

h2 {
  color: #fff;
  font-size: 30px;
  letter-spacing: 12px;
  line-height: 40px;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
  display: flex;
  align-items: center;
  margin-left: 500px;
}

良い解決削を思いつく方がいらっしゃいましたら、教えて頂けると大変助かります。
どうぞよろしくお願い致します。

Answer 1

他のメジャーなフォントで問題ない場合、フォントそのもののバグであることが多いです。

「さわらび明朝の縦書きで文字が重なる」

最新のフォントデータでもまだ問題があるようなら、報告しておくとよいでしょう。

解決策は、フォントを変えるか縦書きをやめるしかないと思います。

Comments

[genjiro]

ありがとうございます。

最新のフォントでもダメでした。

困りましたね。どうしてもこのフォントを使用したかったのですが、、、