WinIEがabbr要素を理解しないことへの対応として、The Web Kanzakiで用いられいてたスクリプトを少し変更したものを使ってました（参照: 見よう見まねJavascript）。それで今まで動作上特に問題もなく、またinnerHTMLと正規表現を使ってソースを書き替えるという手法はスクリプトの見た目もすっきりしていて分かりやすいのですが、別の手段として、正規のDOM的手法を用いてなんとかならないかと考えまして、試してみることにしました。DOMの勉強も兼ねて。 やり方としては、abbr要素ノードからその子テキストノードとtitle属性を取り出して、それを新しく作ったspan要素に適用し、span要素を文書に追加する、という感じで行けるかなと思っていたのですが、実際にやってみるとabbr要素の子ノードが取り出せなくて躓きました。色々と試してみる中で、確認のため、 <abbr tit

注意 MSIEにおけるXMLの取扱は、外部APIであるMSXMLが受け持つことになっています。従って、インストールされているMSXMLのバージョンが異なれば、当然挙動も異なります。 ここでは、MSIEに同梱されてきたものに関して話を進めることにします。 2008年3月現在、MSIE 7.0 + MSXML 4.0 の組み合わせにおいても、同様のことが言えます。つまり、XHTMLの扱いと実装に関して言えば、殆ど進歩が無いと考えられます。 Win/Mac 共通の実装状況／不具合 Mozilla や Opera などと異なり、外部 DTD のパージングも行います。その結果、外部 DTD に記述された実体参照の内容が XML 文書インスタンスにも反映されます。 文書の妥当性までは検証しません。整形式にさえなっていれば、 DTD に存在しない要素や属性を書いてもエラーとはなりません。ただし、未定義の

補足 この不具合のために幅が短縮された要素の内部にあるフロートでは、その要素の外部にあるフロートに対してclearプロパティが効きません。以下の例で背景が空色のフロートは青色ボーダーのフロートの下に置かれるはずですが、WinIEでは赤色ボーダーのボックスの内容領域の左上端、つまり青色ボーダーのフロートの右に置かれます。 <div style="float:left; width:3em; height:3em; border:2px solid blue;"></div> <div style="height:1.5em; border:2px solid red;"> <div style="float:left; clear:left; width:5em; background:aqua;">フロート</div> </div>

先日、友達の依頼で XHTML+CSS のコーディングをしていたところ、position:absolute を指定したボックスが Win版IE6 でのみ表示されないという現象に出くわしました。あちこち調べてみたところ、かなり厄介な IE のバグのようで、消えるときの条件がいろいろあることがわかったので、整理してみたいと思います。 まず最初に見つけたのが、以下のサイト。 » IEで position:absolute した要素が消えるバグ こちらで紹介されているのは、float と clear にはさまれた position:absolute が消えてしまう現象とその対策。でも、私がはまったケースでは、position:abloslute の前には float がありません。紹介されているように clear を追加してみても当然ダメ。う～ん、なぜだ・・・ 日本語のリソースを調べてみても解決策

http://jmblog.jp/archives/180より。 Bruno Fassino氏のIE/Win: Disappearing position:absolute boxes near to floats and clears のテストを元にしています。 日本語 | English 概要 Win/IEでは、以下の場合に絶対配置（position: absolute）にしたボックスがレンダリングされないことがある。 position:absolute が float と hasLayout をもつ clear の直前に存在する場合。（Test1） 解決方法 : #1, #2, #3, #4, #5 position:absolute が float と hasLayout をもつ clear との間に存在する場合。（Test2） 解決方法 : #1, #2, #3

ぴのBlog 一貫して一貫性が無いブログ。競馬予想メモ・時々料理‥。 http://pinotan.blog15.fc2.com/ htmlソース上では下方に置いてある検索窓などを、position:absoluteでページ上部に絶対配置する。よく使われる手法だと思うんですが、Win IE（Windows Internet Explorer）ではposition:absoluteを指定した要素が表示されない場合があるみたい（IE6/IE7 beta 2）。IEのバグ？(仕様なのかバグなのかは知りません)例えば下記のような順序で組まれた物。 カラム : float カラム : float 検索窓 : position:absolute フッター : clear:both html上では検索窓がfloatとclearに挟まれている。検索窓はfloatとは無関係に配置出来るはずだが

原因とかよく解らないんですが、IE6とIE7で謎の挙動に悩まされたのでメモ的にエントリしておきます。 症状 IEでウィンドサイズの変更を行うと、position: relative;を使用した要素がズレます。 お気に入りバーを出しても同様。 CSS div { position: relative; width: 300px; margin: 0 auto; height: 300px; /* 見やすくするための指定 */ background: skyblue; /* 見やすくするための指定 */ } h1 { position: relative; top: 10px; left: 20px; } HTML <div> <h1>Test Title</h1> <p>hogehogehogehoge</p> </div> ウィンドサイズ変更前 ウィンドサイズ変更後 例えば上記のコードで表

IE7に付いたズーム機能を使って拡大・縮小したときに body に指定した背景画像が拡大・縮小されず、理由が分からず困ったことがありました。 「原因は haslayout の値が false になっているから」 隣にいた同僚にそう教えてもらってなんとかズーム機能に対応はできましたが、今後同様の事例が出た時に困らないようにメモ。 で hasLayout って何？ hasLayout は IE 独自のプロパティで、各要素がレイアウト情報を持っているかどうかを示すもののようです。 上に書いた背景画像の拡大・縮小時のバグは hasLayout プロパティの値が false になっている場合に起こるそうです。 その他のバグの情報は Microsoft の Internet Explorer 7におけるズーム機能の問題 ( http://support.microsoft.com/kb/933053/

IE7で拡大・縮小時にレイアウトが重なってしまったり、IEでフロートした要素がはみ出てしまったりとIE独自のCSSのバグがいくつかあります。 これは、IEのhasLayoutが原因のひとつとなっているので、それを回避する方法を考察します。 hasLayoutとは IEでのCSSのバグを回避するhasLayoutの値 CSSのバグに効果のあるhasLayoutの指定方法 hasLayoutの参考ページ hasLayoutとは hasLayoutとは、オブジェクトがレイアウトを持っているかどうかを示すものです。 hasLayoutの値はread-onlyのため読み込みのみ可能で、falseとtrueがあります。 hasLayoutの値（read-only） false デフォルト値。 オブジェクトがレイアウトを持っていない。 true オブジェクトがレイアウトを持っている。 IEでのCSSのバ