bodyに指定するfont-sizeやfamilyなど
以前エントリーした記事、IE8とIE7はメイリオ、IE6/FFはMS Pゴシック、Mac Safari/FFはヒラギノ角ゴを表示から早くも3年近く経っている事にびっくりしました。ブラウザに関する事情は大きく変わってIEの最新版は9で現役のIEは6〜9（IE6を排除するサイトもだいぶ増えましたが）加えてChromeのシ
IE対策 の一覧
IE8とIE7はメイリオ、IE6/FFはMS Pゴシック、Mac Safari/FFはヒラギノ角ゴを表示
以前エントリーした記事、IE7はメイリオ、IE6/FFはMS Pゴシ、Mac Safari/FFはヒラギノ角ゴを表示から1年4ヶ月ほど経ちました。ブラウザの最新版はIE8/FF3/Safari4となったのでフォントのセットを少々変更してみました。 IE8ですが、IE6/IE7と同様にフォントをピクセル指定すると文字の
inline-blockを使ってのマルチカラムレイアウト（段組み）
IE8、FF3、Safari、Opera、Chromeで正式にサポートされているdisplayプロパティの値inline-blockを使ってマルチカラムレイアウトを実装するテストをしてみました。 View Demo 通常2段組み、3段組みなどのレイアウトを組む場合、floatプロパティを使って左右にふったりすると思いま
jQueryを使ったブラウザ分岐
Windows IE6/7はフォントをpx(ピクセル)指定すると文字のサイズが拡大出来ません。そのため今まではIEでフォントサイズを拡大出来るようにするため次のようにハックを使っていました。 body { font-size: 100%; } * html body { font-size: 82%; } /* fo
透過pngをロールオーバーさせる
この2〜3日、透過pngを大量に使うデザインのコーディングを行っていましたが、その中で困ったのがIE6で透過pngがロールオーバーしてくれないこと。 様々なライブラリを試したけれどもやっぱりロールオーバーしません。ところが唯一ロールオーバーに対応していたのがユンサンが配布しているiepngfix.jsのバージョン1.
jQuery Plugins IE Png fixでIE6に透過pngを適用
IE6で透過pngを表示させるのにユンサンのiepngfix.jsを良く使います。しかし最近jQueryを使用してサイトを構築するケースが増えたため、jQueryの透過pngをIE6に対応させるプラグインのIE Png fixを試してみました。 使い方は簡単でimg要素のsrc属性を調べ、pngファイルだったら適用さ
IE7はメイリオ、IE6/FFはMS Pゴシ、Mac Safari/FFはヒラギノ角ゴを表示
自宅ではMacを使ってますが、職場はWindows環境なので普段はWindows Firefoxをメインに使ってます。 最近メイリオを指定しているサイトがぼちぼちと。ところがFirefoxやIE6なんかで見てるとアンチの切れたメイリオが表示されて非常に読みづらいのです。VistaのFirefoxはどうだかわからないけ
定義リストdt ddを横並びで表示させる
定義リストであるdt ddを横並びにさせたい場合、僕はfloatを使うケースが多いのですが、Windows IE6では最初のddが約0.2emほどマージンを多く取るバグがあります。Windows IE7/Firefox/Opera、Macintosh Safari/Firefox/Operaではきちんと表示されます。
fixed.js
昨日某ブログの管理人さんとの飲み会の席で「誰もfixed.jsの事を話題にしないのは何故だ？」なんて事を言われました。 fixed.jsはIE6でposition: fixed;を使う事を可能にするライブラリで、僕の頭の中にはposition: fixed;を使う事自体頭になく特に気にした事はなかったのです。 つい先日
アルファチャンネルをもったpngを使う
IE7で正式にサポートされた24bit png。今年はこのpngを使ったサイトが流行しつつあるけど、このアルファチャンネルを持った24bit pngをIE6以前で使うにはアルファイメージローダーというややっこしい記述をする必要があった。しかもアルファイメージローダーを使用した要素内にリンクがあった場合、リンクが効かない
floatにmarginを指定した場合
WinのIEはfloatを指定したボックスにmarginの値が指定してあると倍のmargin値として認識するダブルマージンバグが発症するケースが多々ある。（例えばmargin-left: 10px;なんて指定してるのに20pxのmarginになったりする。） floatさせたボックスにmarginを指定しないようにすれ
floatを解除する - clearfix -
floatを使って画像にテキストを回り込ませて解除する時 clear:both;やclear:left;などを使うけど、テキストの量が少ないと上手く解除されない。 例えば...... 画像にテキストを周りこませる。 この状態から回り込みを単純に解除するには空のdivタグやbrタグにclear: both;プロパティを与
1