CSS/DHTMLバグ辞典スレッド【第5版】 (627レス)
上下前次1-新
594: 2019/01/17(木)03:12 ID:??? AAS
>>593
font-family: system-ui;は、IE未対応らしい。
外部リンク:developer.mozilla.org
で、プレースホルダーのフォント名が親要素であるinput要素と不一致なのがいけないんだから、
:-ms-input-placeholder {font-family: inherit;}
がバグ対処法になる。祖先要素からの継承を明示するわけ。
WordPressの場合はこれを子テーマのcssファイルで上書きすれば良し。
これで、入力フォームにカーソル入れると横幅が伸び縮みする不条理は避けられるはず。
595: 2019/01/22(火)02:38 ID:??? AAS
>>583
>しかも、三点リーダー「…」なんかは欧文式にベースライン表示の「...」になる罠。
「三点リーダが真ん中に表示されない理由」
外部リンク[php]:www.koikikukan.com
「三点リーダ問題、webfontでついに解決!……か?」
外部リンク:orangeprose.blog.fc2.com/blog-entry-320.html
「三点リーダー(…)を真ん中に表示する方法」
外部リンク[html]:blog.sixapart.jp
「「三点リーダの表示位置」問題を完全かつ最終的に解決する」
外部リンク:d.nekoruri.jp
省1
596(4): 2019/01/22(火)19:34 ID:??? AAS
【IE・Firefoxバグ】InternetExplorer11、Firefox64、GoogleChrome71、をWindows8.1で確認。
font-familyプロパティが、@font-face内だと通常と違って和文フォントを英字名しか読み込まず日本語名を受けつけなくなる。
また特にFirefoxではファミリー名にウェイトを附けると認識しないことがある(>>585の逆)。フォント・ファイル名なら末尾に‘-weight名’が入っても可みたいだけど、それではChromeで反映しなくなる。
バグではなく仕様にしても、ブラウザ間の不一致がひどすぎて、使用するのに困惑する。
OS標準インストールの和文フォント名一覧とも微妙に齟齬する。
外部リンク:w3g.jp
Webフォントでなくローカル・フォントに對して@font-face内font-familyでフォント・ファミリー名を上書きして複数まとめたりする手法(下記等)が、無為になる。
外部リンク:text.baldanders.info
外部リンク:qiita.com
外部リンク:qiita.com
省17
597(4): 2019/01/22(火)19:35 ID:??? AAS
>>596のテスト結果
"MS 明朝" IE× FF× GC○
"MS Mincho" IE○ FF○ GC○
"游明朝" IE× FF× GC○
"Yu Mincho Regular" IE× FF○ GC×
"YuMincho-Regular" IE○ FF○ GC×
"Yu Mincho" IE○ FF× GC○
"YuMincho" IE× FF× GC×
"ヒラギノ明朝 ProN" IE× FF× GC○
"ヒラギノ明朝 ProN W3" IE× FF× GC×
省22
598(1): 2019/01/22(火)20:51 ID:??? AAS
>>596
外部リンク:www.tomotanuki.com
「指定するフォント名は現段階ではブラウザによってまちまちです。
ChromeとOperaは「游ゴシック」「Yu Gothic」でも標準(Regular)を指定できたりします。
ですが、Firefoxでは「Yu Gothic Medium」と英語名+ウェイトで指定しなければなりません。
これは標準(Regular)でも同じで標準(Regular)サイズをFirefoxで指定したい場合は「Yu Gothic」ではなく「Yu Gothic Regular」と指定しなければ表示されません
(ちなみに「Yu Gothic Regular」で設定すると、ChromeとOperaとIE11では表示されません)。」
「Chromeの現バージョン ( 58.0.3029.110 (64-bit) ) で英語フォント名(Yu Gothic Medium)を認識しないようです。」
Hiragino Sansフォントウェイトのcss書き方まとめ
599: 2019/01/22(火)20:53 ID:??? AAS
>>598
Hiragino Sansフォントウェイトのcss書き方まとめ
外部リンク:joppot.info
外部リンク:hiragino.joppot.info
600(1): 2019/01/22(火)21:20 ID:??? AAS
>>596・>>597
>"Yu Mincho Regular" IE× FF○ GC×
>"YuMincho-Regular" IE○ FF○ GC×
>"Yu Mincho" IE○ FF× GC○
ChromeはPostScript Nameを認識できないので、Font Family Nameで指定しなければならない。
外部リンク:w3g.jp
外部リンク:speakerdeck.com
601(1): 2019/01/22(火)22:08 ID:??? AAS
>>600
しかし"MS 明朝"のPostScript名は"MS-Mincho"らしいが、
Cf.「フォントのPostScript名, フルネーム, ファミリーの日本語名と英語名」外部リンク[html]:taken.jp
@font-face {font-family: "f01"; src: local("MS-Mincho");}
と指定しても、IE・Firefox・GoogleChromeどれも表示に反映されない。
602(1): 2019/01/23(水)11:38 ID:??? AAS
>>601は誤り。"MS-Mincho"でIE・Firefoxに有効だった。
>>597
>"Noto Serif CJK JP" IE○ FF○ GC○
>"NotoSerifCJKjp-Regular" IE○ FF○ GC×
これがRegularでない他のウェイトだと、IEのみが認識するイレギュラーな結果になる。
"Noto Serif CJK JP Bold" IE○ FF× GC×
"NotoSerifCJKjp-Bold" IE○ FF× GC×
同じ形式で下記ではどのブラウザも読み込まないのに。
"Noto Serif CJK JP Regular" IE× FF× GC×
ダウンロード 外部リンク:www.google.com
省3
603: 2019/01/23(水)14:03 ID:??? AAS
>>596・>>597を整理して纏め直すと――
@face-fontのsrc記述子でlocal()構文を指定する場合
・使用可能なフォント名は、英文名のみ。
フォントの日本語名はIE・Firefox無効、Google Chromeしか認識しない。
・PostScript名はChrome不可、全く効かない。
・名にウェイトが含まれると、PostScript NameであれFull Nameであれ、Chrome不可。
Full NameはIEだとフォントのウェイト(Regular等)によっては不可。
Full NameはFirefoxだとフォント(ヒラギノ・小塚・Noto Serif CJK JP等)によっては駄目。
・ウェイトの含まれない英語フォント・ファミリー名だけにすると、Chromeに有効。
だがIE・FFで読み込まれないフォントもある(ヒラギノや小塚フォント等。游フォントはFFのみ不可)。
省5
604(1): 2019/01/28(月)03:11 ID:??? AAS
バグではなく未対応だかららしいけど、混乱するので。
font-feature-settingsプロパティーは、ほぼ全てのブラウザが対応する。
外部リンク:caniuse.com
外部リンク:developer.mozilla.org
しかし。
font-feature-settingsを@font-face { }内で使用すると、Firefoxでしか有効でない罠。
外部リンク:developer.mozilla.org
605(1): 2019/01/29(火)11:53 ID:??? AAS
他のブラウザではfont-feature-settingsによる字詰めが有効なのに、IE11だけ無効。
font-familyに游明朝・游ゴシックを指定すると発症。
以下で再現。
.yu {font-family:"游明朝", YuMincho;}
<div class="yu" style="font-feature-settings : 'palt';">
くし」、「ト。りょうった
</div>
Firefox64、GoogleChrome71ではちゃんと字詰めされる。
IEでも、プロポーショナルメトリクス情報を持つ他のフォント(#)にするとpaltが効いたので、これはバグと言ってよいかと。
# "ヒラギノ明朝 ProN W3"・"小塚明朝 Pr6N'"・"IPAmj明朝"・"Source Han Sans"等
省1
606: 2019/01/29(火)13:02 ID:??? AAS
>>605
游明朝のカーニング設定がうまくいかない話
外部リンク:qiita.com
Mac (10.12.6)
■ Chrome(64)、Safari(11)、Firefox(58)
Boldとpknaを組み合わせると、カーニングが無効。
Windows(10)
■ IE11
Boldとpaltを組み合わせると、カーニングが無効。
Normalとpaltを組み合わせると、カーニングが無効。
省2
607: 2019/01/29(火)13:10 ID:??? AAS
>>604
ここ↓、その@face-font内font-feature-settingsで嵌ってた。
「CSSで行頭の約物を半角にする」
外部リンク[html]:dskd.jp
608(2): 2019/02/04(月)17:06 ID:??? AAS
【Firefox65/GoogleChrome71 バグ】
IE以外で、JIS外字を表示させるとfont-familyプロパティーで総称ファミリー名serifが効かなくなる。
Win8.1で確認。
p {font-family: "游明朝",serif;}
</p>「专」:ユニコード数値文字参照(16進数)→「&;#x4E13;」</p>
鉤括弧「 」内の外字部分だけゴシック体(sans-serif)になる。
FiefoxやChromeは、初期設定で明朝体 (Serif)は游明朝が既定。
それで游明朝に無い外字は他のフォントで表示されるため、ゴシックになると推定される。
しかしserifが無効になるのは指定に反する。
IE11だと他のフォントでも指定通りserifのフォントを選んでくれる(SimSun等の中国語フォントか?)。
省8
609: 2019/02/04(月)17:09 ID:??? AAS
>>608
× 「&;#x4E13;」 &の後の「;」が不要。
○ 「专」
610: 2019/02/10(日)18:52 ID:??? AAS
>>608
下記ソースで再テスト。
p {font-family:Tahoma,sans-serif;}
.f01 {font-family:"游明朝";}
<p>「专」:ユニコード数値文字参照(16進数)→「专」</p>
<p class="f01">「专」:ユニコード数値文字参照(16進数)→「专」</p>
IE11ではp.f01で「 」内がsans-serifを継承せずserif(游明朝ではない何かの明朝体)になった。
やはりIEは所詮IEで、対応に問題があるみたい。
Firefox65・GoogleChrome72では「 」内はsans-serif(ゴシック体)のまま。
611: 2019/02/15(金)18:30 ID:??? AAS
>>602
>これがRegularでない他のウェイトだと、IEのみが認識するイレギュラーな結果になる。
>"Noto Serif CJK JP Bold" IE○ FF× GC×
>"NotoSerifCJKjp-Bold" IE○ FF× GC×
再現しない。下記の通りになった。
"Noto Serif CJK JP Bold" IE○ FF○ GC×
"NotoSerifCJKjp-Bold" IE○ FF○ GC×
Firefoxで反映しなかったのは、フォントキャッシュとかの問題では?
612: 2019/02/20(水)18:38 ID:??? AAS
>>585
>しかしこれがヒラギノだと、
> font-family: "ヒラギノ明朝 ProN W6","HiraMinProN-W6";
>みたいに、ウェイトまでfont-family指定に入れられるんだけど。
否。ヒラギノでもフォント名にウェイト入れるとfont-family指定が反映されない。
Firefox65、GoogleChrome72、Windows8.1にて表示確認。
font-family: "Hiragino Mincho ProN W6"; /*無効*/
font-family: "ヒラギノ明朝 ProN W6"; /*無効*/
font-family: HiraMinProN-W6; /*無効*/
font-family: "Hiragino Mincho ProN","ヒラギノ明朝 ProN"; /*有効*/
省1
613: 2019/04/19(金)18:42 ID:??? AAS
>>551-553のwhite-space:nowrap;バグ、最新のChrome73になってもまだ直ってないのな。
WebKitのバグってどこに報告すれば修正してくれんのかね?
上下前次1-新書関写板覧索設栞歴
あと 14 レスあります
スレ情報 赤レス抽出 画像レス抽出 歴の未読スレ AAサムネイル
ぬこの手 ぬこTOP 0.011s