CSSメモ

フォントによるデザイン崩れ ページ20

##

em7が調べたところ、
「fontpoにほんご」
「こころ明朝」
「自由の翼」
などのフォントで、デザイン崩れが起きます。

iPadからしか確認していないのですが、いずれのフォントも、上の検索する入力欄の下のリンクが崩れてしまいます。

簡単に言うと、「検索」というボタンが下にきてしまい、リンクがはみ出てしまう、ということ。



Androidでも別の部分で謎の改行が入る現象が起きています。

原因は、フォントの半角スペースが大きい事です。
前はローカルフォントを設定して回避していましたが、Robotoのスペースだけのフォントを用意したのでこちらを使ってください。
英語や数字も日本語フォントのものを使うことが出来る様になりました。

(再配布の際はルールの確認を!!)→ルールはこちら

@font-face{
font-family:日本語フォントの名前;
src: url(日本語フォントのファイルURL);}
@font-face{
font-family:space;
src:url(https://dl.dropboxusercontent.com/s/jonum3ock74wb00/Roboto-space.woff2);
/*------------------------------------
Roboto space only
配布元:https://fonts.google.com/specimen/Roboto
ライセンス:Open Font License/https://ja.osdn.net/projects/opensource/wiki/SIL_Open_Font_License_1.1
CSS配布:http://uranai.nosv.org/u.php/novel/jue10cssma8/
------------------------------------*/}

*{font-family:space,日本語フォントの名前 !important;}

日本語フォントの部分は適宜変えてお使いください。

ここで紹介した、「こころ明朝」「fontopoにほんご」以外にも、崩れてしまうフォントはあるので注意してくださいね。

##

ラジオボタンとチェックボックス→←細かい色々

→ 目次へ｜作品を作る｜感想を書く
他の作品を探す