webkitとfirefoxに関するtarchanのブックマーク (2)
-
Firefox 49では、既存のコンテンツとの互換性を高めるため、-webkit-のベンダープレフィックス︵以下﹁webkit接頭辞﹂︶がついたCSSプロパティや属性を多数サポートしている。layout.css.prefixes.webkitが初期設定で有効化される︵Bug 1259345︶ことによるもので、ベータ版リリースノートには掲載されていないが、Chrome・Safariを基準に作成されたコンテンツの表示精度が向上するため、一般ユーザーにとっても重要な変更といえるだろう。 サポート対象となる具体的なプロパティや属性については、MDNのFirefox 49 for developersにまとめられている*1。が、初期設定で無効のものが混じっているなど若干煩雑なので、改めて整理しつつ列挙しておこう。 -webkit接頭辞がついていても動作するプロパティ -webkit-align-it
-
デザイン要素を固定しないリキッドレイアウトは、未知の端末にも対応するというコンセプトのもとに実装するレスポンシブウェブデザインには必須だと考えています。そのリキッドレイアウトを実装する際に理解しておきたいのが、パーセント値で幅や高さを指定した際に小数点以下になるピクセル値︵10.5pxとか9.2pxなど︶に対するブラウザの挙動です。 たとえばグリッドシステムを構築する際、計算上はあっているのにブラウザでは思った通りに表示されないといったことが起こります。これは、各ブラウザのサブピクセル︵小数点以下のピクセル値︶の扱いの挙動差により生まれます。 まずはパーセント指定の基本から まずは前提となるパーセント指定の際の計算の基本のおさらいから。。。 CSSでパーセント値を使って幅や高さ指定をすると、指定した要素を含む親要素をベースにピクセル値が計算されます。 たとえば100pxの親要素の中にある子
-
1