CSSで縦書きにした箇所の濁点が崩れる
游明朝体で縦書き指定した箇所の「が」のような濁点の文字が
以下の画像のように崩れてしまいます。
font-familiyをserifに指定する
と崩れは解消されるのですが、
サイト全体のフォントに游明朝体が採用されているため
可能なら、游明朝体で再現したいと考えております。
お知恵をお貸しいただければ幸いです。
以下、HTML・CSSです。
html
1<section class="cf"> 2 <div class="txt_wrap ja"> 3 <h3>プラスが生まれる場</h3> 4 <p> 5 日本語のテキストが入ります。日本語のテキストが入ります。<br> 6 日本語のテキストが入ります。日本語のテキストが入ります。<br> 7 日本語のテキストが入ります。日本語のテキストが入ります。 8 </p> 9 </div> 10 <div class="txt_wrap en"> 11 <h3>Test</h3> 12 <p> 13 test test test test test test<br> 14 test test test test test test<br> 15 test test test test test test 16 </p> 17 </div> 18</section>
css
1body { 2 font-size: 16px; 3 font-family: "Playfair Display", "游明朝", "YuMincho", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "MS P明朝", "MS 明朝", "Noto Serif JP", serif; 4} 5 6.txt_wrap.ja { 7 height: 300px; 8 float: right; 9 line-height: 1.5; 10 letter-spacing: 0.04em; 11 -webkit-writing-mode: vertical-rl; 12 -ms-writing-mode: tb-rl; 13 writing-mode: vertical-rl; 14}
回答1件
あなたの回答
tips
プレビュー