ドットインストール代表のライフハックブログ
![IDEA * IDEA](https://cdn-ak-scissors.b.st-hatena.com/image/square/1f15985244f2599b686ec8d860b448c4fecc4d0c/height=288;version=1;width=512/http%3A%2F%2Fwww.ideaxidea.com%2Fwp-content%2Fplugins%2Fwp-ogp%2Fdefault.jpg)
CSS-Discussにアップされている「IE 7 Bugs」の意訳です。 省略している箇所も多数あるので、原文も参照ください。 Internet Explorer Win Bugs - css-discuss 注意: バグには、IE7のみでなく、IE 5, 5.5, 6のものも含まれています。 公開されてから時間が経っているためか、ちょっと古いものもあります。 IEのフォントサイズのバグ フォントサイズの継承 IEの相対指定のフォントサイズの継承は、うまく機能しません。 相対指定を行う場合、emより%で指定を行う方が便利です。もし、em指定を行う場合は最初に%指定を行ってください。 例: body{ font-size: 100.01%; } ※100%の代わりに100.01%を使用するのは、Operaでの継承バグの回避のためです。 キーワード指定でのサイズ フォントサイズに「small
lingrクライアントをGreasemonkeyで作ってみたで作っているlingrクライアントを作っていて気づいたんですが、youtube movieを表示させようとしたときに、 <object id="movie" height="370" width="450"> <param name="movie" value="http://www.youtube.com/v/_g82Tx033Ck" /> <param name="wmode" value="transparent" /> <embed wmode="transparent" type="application/x-shockwave-flash" src="http://www.youtube.com/v/_g82Tx033Ck" height="370" width="450"> </object> とhtmlを出力するわ
これらをダウンロードして組み込み、ホスト上で動かすと動作しない。いや、正確には動作したりしなかったり、だ。何がトリガーとなって動作するかがわからない。 一応、最小構成で動作させると動いた。 そもそも、FlashとJavaScript間で直接通信するのはExternalInterfaceというらしく、これが働いていないおかげで、結果としてFlashのストレージが機能していないようだ。 というわけで幾つか策を練ってみた。検証には3ブラウザで動作したsave2localを使用する。Flashのバージョンは全て9.0.16.0だ。 DOMの汚染 真っ先に思いついたのがコレ。特殊なアプリに組み込んでいるから動作しないのではないか? そこで、最小構成で動作するページを用意し、そのページをIFrameで呼び出し、 document.getElementById( id ).contentWindow.s
Thank you, Firebug. You made the web amazing for all! The story of Firefox and Firebug are synonymous with the rise of the web. We fought the good fight and changed how developers inspect HTML and debug JS in the browser. Firebug ushered the Web 2.0 era. Today, the work pioneered by the Firebug community through the last 12 years lives on in Firefox Developer Tools. Switch to the latest version of
IE、折り返し直後の要素位置の異常 JavaScript DIVにSPANでタグ付けした文字列を流し込み、折り返し直後の文字/要素の位置を取得したところ、IE 7、IE 6では異常な数値が返りました。 微妙な話で、引っかかる確率は少ないですが、はまると痛いです。 まず、以下のHTMLに、 <div id="box"> <span id="E1">あ</span><span id="E2">あ</span><span id="E3">あ</span> </div> 以下のスタイルを適用します。 ポイントは、幅が固定されている点と、ボックス左上からの距離を取るためにposition:relativeになっているところだけです。 #box{ position : relative; width : 1em; background-color : #CCC; line-height : 1em;
IE7 の日本語版もリリースされ、ぼちぼち使い始める人たちも増えてきそうな今日この頃。 IE7 からは今まで Firefox 等に比べて遅れていた CSS への対応も進み、サイト制作者にとってはうれしい限りなのですが、実際 IE7 のCSS レンダリングはいかがなものか、簡単に検証してみました。 今回検証したのは、IE7 におけるボックスモデルの取り扱いと、セレクタへの対応状況。 まずはボックスモデルの検証ですが、用意したのは下記の XHTML と CSS。 <ul> <li class="first_list">First element of list</li> <li class="second_list">Second element of list is a bit longer to illustrate wrapping.</li> </ul> ul { margin:0;
CSSを使ったレイアウトをする際にWinIE6のバグを回避するための「定石」をまとめておきます。 とくに重要だと思うものは強調してあります。参考としてバグ辞典へのリンクも用意しました(つまり回避法を用いない場合にどんなバグが発現するか)。 フォントサイズ関係 font-sizeは%かpxで指定する。 キーワードで文字サイズを指定すると標準モードと互換モードで文字サイズが変わる(IE6) em単位で指定した値が文字サイズ変更後に正しく反映されない(IE6) ボックスモデル関係 widthと同時に左右borderや左右paddingを指定しない。heightと同時に上下borderや上下paddingを指定しない。 ボックスの幅や高さを算出するときにパディングやボーダーのサイズを含めてしまう (ブロックレベル要素を内包するボックスにはpaddingを指定しない。) 左右ボーダーとパディングを設
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く