【Android】記号文字が大きくなったり小さくなったりする

  • URLをコピーしました!
目次

Android 6.0系のChromeでページを開くと、文字の大きさがおかしい

2番目の四角だけがAndoridのChromeでは表示が大きくなっている。

大きさが違うがすべて同じ ◆

特別なcssは設定されていない。

※Android 6.0系の端末で確認。その他のバージョンでは未確認。

<ul class="col">
  <li>◆ああああああ</li>
  <li>◆嗚呼</li>
  <li>◆イイ</li>
  <li>◆   </li>
</ul>

 

USBデバッグしてみたところ、どうやら特定の文字の手前に来る ◆ が大きくなるようだ。
漢字がいけないかと思えばそうでもない。

位置を変えても、大きい。

文字と ◆ の間に半角スペースを入れると、小さくなる※下記3行目

Androidの日本語フォントのバグだろうか……?

Androidではコピーライトマークの色がおかしくなる現象も確認されている。

新潟のホームページ制作会社 (株)...
Androidでコピーライトマークの色だけがおかしい現象について lang=””の設定で色がおかしくなる 最近、コピーライトマーク「©」の色が…

とりあえずの解決策

テキストで入力するのをやめて、liのbefore疑似要素にした。

ul.list_icon{
  li{
    &:before{
      content: '◆';
    }
  }
}

こうすると、◆と文字との間にほんのりホワイトスペースが入るはずなので、それによって解決。

よかったらシェアしてね!
  • URLをコピーしました!

コメント

コメント一覧 (1件)

  • そういうことだったんですね。
    同じ現象で悩まされていました。
    ありがとうございました。

コメントする

コメントは日本語で入力してください。(スパム対策)

CAPTCHA

目次