質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.48%
CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

Q&A

解決済

1回答

2712閲覧

IEで游明朝体の縦書き表示が崩れてしまう

tomari

総合スコア14

CSS3

CSS(Cascading Style Sheet)の第3版です。CSS3と略されることが多いです。色やデザインを柔軟に変更することが可能になります。

HTML5

HTML5 (Hyper Text Markup Language、バージョン 5)は、マークアップ言語であるHTMLの第5版です。

0グッド

0クリップ

投稿2019/07/24 07:08

編集2019/07/24 07:13

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}

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

azuapricot

2019/07/24 07:16

同じ質問を何度も何度もしないでください。 質問は編集できます。 いらない方は削除してください。
tomari

2019/07/24 07:24

大変失礼いたしました。 最初に上げてしまったものには削除依頼を出していたのですが 編集から修正をしたらよかったですね... まだこちらの操作に不慣れで以後気をつけたいと思います。
guest

回答1

0

ベストアンサー

それ、単に「が」ではなく「か゛」と、文字と濁点が別の文字になってるだけなんでは。
ソースを確認してみればどうでしょう

投稿2019/07/24 07:47

y_waiwai

総合スコア87747

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

tomari

2019/07/24 07:59

回答ありがとうございます! テキスト、崩れ箇所のみ打ち直しをしてみましたところ あっさりと問題解消いたしました...!! よくよく考えてみると、 この箇所のテキストはPDFからコピペをしていたところで そのあたりが要因になっていたようです。。 こんなに単純なことだったとは、、お教えいただき ありがとうございます。とても助かりましたm(_ _)m
ikadzuchi

2019/07/24 12:07

「゛」ではなく、合成用濁点U+3099「 ゙ 」でしょうね。 確かに游明朝・IEで異常、游明朝・FirefoxやMSゴシック・IEで正常になりました。 Macで入力される文字によく入ります。
guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問