yamaokaです。 CSSに携わっている方なら、Holly hackを使ったことがあるかもしれません。 /* Hides from IE5-Mac \*/ * html .foo { height: 1%; } /* */ Internet Explorer(以下IE)で、レイアウトに問題のある要素に 上記のようなスタイルを指定をすると、 あら不思議、まともな表示がなされるというものです (上記のままではIE7に対応していませんが…)。 さて、どうしてレイアウトが意図したとおりに行われるようになるのでしょうか。 IEのhasLayoutプロパティ IEでは、全ての要素が 「hasLayout」という読み取り専用のプロパティを持っています。 これはそれぞれの要素がレイアウト情報(=要素の幅・高さなどに関する属性情報)を 保持しているかどうかを示す値で、 デフォルトの状態では「hasLayo
« 9 月 2008 10 月 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 Internet Explorer と Firefox を併用している人は要注意 7 月 16th, 2007 Firefox, Security alectrope さんの記事を読んで初めて知ったのですが、Windows マシンに Firefox と Internet Explorer をインストールしているような環境下では、IE 経由で Firefox の脆弱性を突かれてしまう恐れがあるらしい。 ブラウザの相互利用から発生する事象で、発端は IE なのですが Microsoft では今のところ修正パッチを出すつもりはないようなので、Firefox 側で次回バージョンアップにて対応してく
絶対配置/フロート状態のリストアイテム要素のリストマーカーが消える(5.x/6.0) 症状 リストアイテム要素(display: list-item; を指定した要素)を絶対配置したり、フロートにしたりするとdisplayプロパティがblock値に変更され、リストマーカーが消えてしまう。 例示 <style type="text/css"> li { border: 2px solid red; margin: 2px; } </style> <ul> <li style="position:absolute; width:5em; left:3em; top:1em;">絶対配置</li> <li style="position:fixed; width:5em; left:3em; top:2em;">固定配置</li> <li style="float:left; width:5em
IEには様々なバグが報告されていますよね。 もうコーダーからしたら勘弁して下さいって泣きが入りそうになるくらいに... 背景色が指定された要素内でfloatがある時、要素内の文字が消えるとか、floatに後続するmarginの値が無視されるとか、widthを指定しているとボックスの中身にfloatしている要素があっても、自動的に高さが伸びるとか。 こういったIEのバグに有効な手段として、IE6まではheight:1%を指定する事で回避したり、IE7でもwidthを指定して回避したりと色々やってると思います。 その他、IE独自拡張のzoomを使った方法なんかもあります。 今まで理由とかは分からないけど取り合えず解決するんだって事で、widthやheight、zoomを指定しておけばいいんだ。 と認識していましたが、つい先日ちょっと気になる内容をみつけましたのでご紹介。 ソレはhasLayou
Google Analyticsでは、従来のページビューというメトリクスのほかにイベントという単位でもデータを集計できるようになりました。 従来通りGoogle Analyticsの_trackPageview()関数でイベント(例えば、あるリンクをクリックしたなど)を追跡することもできます。ただ、_trackPageview()を使う弱点は、その名前の通りページビューとしてカウントしてしまうので、ページビューをサイトの分析指標に使用している場合、実際のページビューと、Analytics上でのページビューがずれてしまう点にあります。 Event Trackingでは、イベントという別のデータとしてトラックするデータを扱うため、Analytics上でのページビューデータを狂わせることなく、イベントを追跡できます。 ただ、Event TrackingはClosed Betaということで、申し込
Firefox の中で、IE エンジンを使ったタブを開くことの出来る IE Tab(Home)という拡張機能があります。一、二ヶ月前に試したときにはぜんぜん使えないなぁと思っていましたが、1.0.7 がリリースされ、評判も良いようなので再度試して見ました。結論を言うと、基本機能に関してはまず問題なしです。 Windows Update や Gyao も問題なく使えています(ただし、Windows Update はダウンロードまでは試していませんが:追記:問題なく動作します)。以前は全滅だった会社の業務アプリケーションもまったく問題無しです。ということで、さっそく IE View から乗り換えました。IE View は私にとっては Firefox 1.5 にインストールするたった3個の拡張機能に入れるくらいのお気に入りだったので、IE Tab が新しいお気に入りとなりそうです。ということで、
普段CSSを書くときにはブロック整形コンテキスト(block formatting context)のことなんて考えていませんが、実際にそれが問題になるケースがあったのでメモ。 右上フロート広告枠の雛形 一つ目の問題は Firefox で広告ボックスの下にスペースが空いてしまうこと これはたぶん、Clearing floatsのせいでしょうね。 Clearing floatsはフロートのコンテナにoverflow:hiddenやautoを指定することでコンテナの高さを確保するテクニックですが、 overflowのせいで新たなブロック整形コンテキストが生じています。 これが先行する右フロートと重なりそうな場合には、CSS2.1 9.5の規則によって、ボックスの幅が縮められる(またはclearされる)ことになります。 (floatやoverflowとブロック整形コンテキストの関係については『セ
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く