[CSS]これは便利！検証が面倒なフォールバックのスタイルを簡単に検証できるChrome, Firefoxの機能拡張
CSSでレイアウトをする際、最近の主流はFlexbox、そしてCSS Gridも増えてきました。 そんな中、サポートされていないブラウザ用に必要になるのがフォールバックです。 検証するのが面倒なフォールバックのスタイルを簡単に検証できるChrome, Firefox対応の機能拡張を紹介します。 Feature Queries Manager -GitHub Feature Queries Managerの機能 Feature Queries Managerのダウンロード Feature Queries Managerの使い方 Feature Queries Managerの機能 Feature Queries Managerはその名の通り、@supports機能クエリに記述されたCSSのスタイルを管理して、切り替えることができます。 例えば、レイアウトをFlexboxで実装する場合、Fle
![[CSS]これは便利！検証が面倒なフォールバックのスタイルを簡単に検証できるChrome, Firefoxの機能拡張](https://cdn-ak-scissors.b.st-hatena.com/image/square/971099afcdbec5ce4d85c8447e3cda9402d0849b/height=288;version=1;width=512/https%3A%2F%2Fcoliss.com%2Fwp-content%2Fuploads-201802%2F2018052507.png)
これから開発されるFirefoxの新規機能は、HTTPSにしか対応しない。新規のCSSプロパティなども対象
これから開発されるFirefoxの新規機能は、HTTPSにしか対応しない。新規のCSSプロパティなども対象 Firefoxを開発するMozillaは、Firefoxにおいてこれから開発されるWeb関連の新機能はすべて安全なコンテキスト（Secure Context）のみを対象にすると、Mozilla Security Blogの1月15日付の記事「Secure Contexts Everywhere」で明らかにしました。 安全なコンテキストとは？ 安全なコンテキストとは、W3Cのドキュメント「Secure Contexts」で厳密に定義されています。日本語での説明はMDNの「Secure Contexts」で読むことができ、次のように説明されています。 (HTTPS / TLS を介して) コンテンツが安全に配信され、安全ではないコンテキストとの通信の可能性が限られているという合理的な確信
opacityを適用した時にオンマウスで画像が1px動いてしまったりするバグの解決法 | 素材の壺
今回は透明度を指定するためのプロパティ「opacity」で発生したバグの解決法を書いていきます。まずは「.opacity」というクラスに、opacityの指定を行ないます。 .opacity:hover{ filter:alpha(opacity=80); /*IE*/ -moz-opacity:0.8; /*Firefox*/ opacity:0.8; /*Opera・Safari*/ } そしてこの「.opacity」を画像に適用します。 <img src="画像パス" class="opacity"> これでオンマウスすると画像が透明になるのですが、Firefoxのみ、オンマウス時に画像が1px動いたり、ひどい時は画像が無くなるような時も。これは背景指定が原因のようで、backgroundの指定を追記する事で解決できます。 background: #fff; これでFirefoxの問
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Webkit-based blurry/distorted text post-animation via translate3d
[Solved] Transforms Cause Font-smoothing Weirdness In Webkit - CSS-Tricks
