for 属性に対する属性セレクタの IE7 での挙動
IE7 には、label 要素の for 属性に対する CSS の属性セレクタが無効になるバグがあります。 label[for="foo"] { background-color: yellow; } この場合 for="foo" という属性を持つ label 要素の背景が黄色になるはずですが、IE7 では無視されてしまいます。これはどうやら for というキーワードが DOM の予約語であることに由来するバグのようです (参考: Attribute Selector (CSS selector) - SitePoint CSS Reference)。そのかわり、IE7 では htmlFor という属性名を利用すればスタイルが有効になります。 label[htmlFor="foo"] { background-color: yellow; } ただこれだと IE8 以降やほかのブラウザが解
CSS の position: fixed により描画領域全体を覆う要素を IE 6 でエミュレーションする - vivid memo
Lightbox のように、ブラウザの描画領域全体に何らかの要素を表示したいような場合、おそらくは CSS で position: fixed を指定すると思います。 しかしながら、Internet Explorer 6 は position: fixed をサポートしていないので、IE6 で同じ事をするには別の方法を採らなければいけません。 IE6 で position: fixed と似たような動きを行わせる方法は、例えば以下のようなものがあります。 IEで「position:fixed;」を使う方法 (Archiva) 自分の web ページ上で使うのであればこの方法でいいと思うのですが、Lightbox のようにライブラリとして配布するものの内部で使うには多少物足りない部分があります。 例えば、指定の要素が position: relative を指定されている要素の子孫である場合
CSS3 Compatibility Tools, Resources and References for IE
CSS3 is the coolest thing to happen to web design in a long, long time. With all of its incredible new properties, border-radius, box-shadow, border-image, transform to name just a few, a new dawn has arrived, and opened up a multitude of powerful and exciting options that have refreshed the web design community as a whole. Yes, we do love it! Not everybody loves it, well, not as yet, anyway. They
IE6〜IE8をCSS3に対応させるスクリプト「Kick-ass CSS3 Support in IE6, 7, and 8」
TOP > WebDesign > IE6〜IE8をCSS3に対応させるスクリプト「Kick-ass CSS3 Support in IE6, 7, and 8」 WEBサイト構築においてもはや常識となったCSS。新たな仕様のCSS3が整備されつつあり、表現の幅をさらに広げてくれるものになっていますが、最新のブラウザのみ対応しており、IE6のようなシェアがある旧世代のブラウザは対応していないというのが現状です。そこで今日紹介するのはIE6〜IE8をCSS3に対応させるスクリプト「Kick-ass CSS3 Support in IE6, 7, and 8」です。 全てのCSS3のプロパティが適応されるのではなく、角を丸くしたり、ボックスに影を入れたりテキストに影を入れたりといったCSS3の機能をスクリプトにｙほって再現するというものです。 詳しくは以下 スクリプトを読み込ませると言
「behavior（.htc）」IE限定CSS機能 よさげなのピックアップ
Fantasy ～Nucleusスキン [2009-02-12] スコア 68[-tm-http://www.apehjerne.com/Pages/Blog/testfantasi.php-]clips v2 ～Nucleusスキン [2009-02-12] スコア 68[-tm-http://nucleus.susto.jp/-]Company ～Nucleusスキン [2009-02-12] スコア 68[-tm-http://www.vanrai.co.jp/testroom/nuc33C/-]defaultスキン日本語版 (SUCバージョン) ～Nucleusスキン [2008-01-16] スコア 68[-tm-http://kyms.ne.jp/nc_sqlite/-]Umora ～Nucleusスキン [2007-10-25] スコア 68[-tm-https://luvs
IE6 でガタつかない positoin:fixed をさせるための詳細条件を調べてみた - Cyokodog :: Diary
「IE6 position:fixed の諸問題を解決する jQuery.exFixed.js」について、たくさんのコメント、フィードバックありがとうございます。 exFixed のうりとして「IE6 でもガタつかない position:fixed ができる」というのがありますが、フィードバックでいただいたバグを解消する際に、ガタつき防止の前提条件をいろいろと調べたので忘れないようメモしときます。 固定位置に表示させる処理 まず固定位置表示処理のおさらいから。 IE 固有機能の expression を使います。expression は CSS 定義内でも記述することができますが、JavaScript 内で記述する場合は以下のように書きます。コードは jQuery ベースです。 //位置調整ができるように position:absolute にします var el = $('#fixedE
［柔軟すぎる］IEのCSS解釈で起こるXSS
［柔軟すぎる］IEのCSS解釈で起こるXSS：教科書に載らないWebアプリケーションセキュリティ（3）（1/3 ページ） XSSにCSRFにSQLインジェクションにディレクトリトラバーサル……Webアプリケーションのプログラマが知っておくべき脆弱性はいっぱいあります。そこで本連載では、そのようなメジャーなもの“以外”も掘り下げていきます （編集部） なぜか奥深いIEのXSSの話 皆さんこんにちは、はせがわようすけです。 第1回「［これはひどい］IEの引用符の解釈」と第2回「［無視できない］IEのContent-Type無視」でInternet Explorer(IE)の独自の機能がクロスサイトスクリプティング（XSS：cross-site scripting）を引き起こす可能性があるということについて説明してきました。 第3回でも引き続き、IE特有の機能がXSSを引き起こす例ということで、
IE8での変化点一覧 + 備忘録 - latest log
IE8 ではかなりの数のメソッドやプロパティが増えているようです。書き残します。 element.getAttribute について追記しました。 window.toStaticHTML window.toStaticHTML は、XDomainRequest や postMessage で受け取った文字列(HTML)をサニタイズ(消毒)するメソッド。 XHRやJsonで受け取った文字列のサニタイズにもシーンを選べば使えるのだろうか。 onclick等のイベントハンドラ系を潰す。 <div onclick="alert('hoge')">hoge</div> ↓ <div>hoge</div> scriptタグを潰す。 <script>alert("hoge")</script> ↓ 無かったことになる CSS::expressionを潰す img { expression(uuClass
IE8バグ？：a要素内に画像があってa要素に背景を指定した時に位置がずれる
キャプチャ見てもらうと分かるようにIE8だけ極端に位置がおかしい。 IE8がリリースされてから、まだあんまりいじってないのでよく分かってないのですが、今組んでいるサイトをIE8でチェックしたら、「あれ？表示がおかしい...」って事に遭遇してしまったので、エントリー。 よくある感じで、リストのマーカー変わりに背景の指定をa要素にして、そのリスト内には画像テキストが入ってたんです。はい。 毎度のようにサンプルも用意してみました。 サンプルを見る 発生条件は調べた感じa要素内にimg要素があって、a要素にbackgroundプロパティの指定をした時に起こる感じです。 img要素にテキストが隣接してても同様でした。 サンプルみたいなデザインの場合、マーカー部分も一緒に切ってしまう事が多いから過去の案件は大丈夫だと思うけど・・・ 取りあえず、今回のサンプルに使ったソースは以下です。 <ul> <li
Kanasan.JS JavaScript 第 5 版読書会 #7: Days on the Moon
Kanasan.JS JavaScript 第 5 版読書会 #7 に行ってきました (当日のチャットログ)。範囲は前回に引き続き CSS の操作、そしてイベント周りと、一般に「JavaScript」といったとき話題になりやすい部分です。参加者のブログ記事は「JavaScriptでCSSとイベントを扱う from Kanasan.JS | Blog.37to.net」のほか読書会のページからたどれます。 display: inline-block; サイ本では解説されていませんが、CSS の display プロパティの値 inline-block に関して話が盛り上がりました。inline-block 及びそれがどのようなレイアウトに使えるかについては以下で解説されています。 書籍などに紹介されていない display : inline-block について (ヨモツネット) inlin
JavaScriptでCSSとイベントを扱う from Kanasan.JS | Blog.37to.net
最終更新日 Sun, 19 Apr 2009 20:27:25 +0900 最後のコメント Mon, 14 Jul 2014 08:14:00 +0900 ブックマーク 先日開催された、Kanasan.JS JavaScript第五版読書会#7のレポートです。 今回はCSSとイベント処理の入門的内容でした。 ご参加頂いた皆様、ありがとうございました。 JavaScriptからCSSを扱う それ程難しくはないので、簡単にまとめておきます。 はまりがちな事 Element.style.colorなど、Element.style.〜のスタイルオブジェクトで操作出来るのは、 インライン指定されたスタイルのみなので気を付ける必要があります。 僕も最初の頃は知らずによく間違えていたのですが、これを知っていると無駄に時間を使わなくて済むと思います。 <style> #foo { background-c
WCAN x CSS Nite 2009 SPRING レポート – VERSIONFIVE
先週末にWCAN x CSS Nite 2009 SPRINGがありました。今回はCSS Niteとの共催セミナーということでセッション数も多めです。テクニックから仕事効率化、ブランディングまで幅広いレイヤーのお話を聴くことができました。 毎度のごとく名古屋国際会議場で。今回も過去最多の200名超の参加があったらしいです。前回が160名程度といことでしたので、どんどん大規模になっていってますね。 [SESSION-1] CSS3＋jQueryで行こう！ [SESSION-2] CSSレイアウト：IE 6対応のかんどころ Lightning Talks [SESSION-3] デザインビュー派？ コードビュー派？ Dreamweaverでのコーディング再点検 [SESSION-4] ブランディングの正体 懇親会 関連記事 [SESSION-1] CSS3＋jQueryで行こう！ 益子 貴寛
IE の innerHTML や appendChild で要素が挿入された瞬間を取得する方法 - IT戦記
要素が挿入された瞬間を取得する 今までは出来ないと思っていたのですが、今日いろいろ試していて出来る方法が分かりました。 ですので、ちょっと紹介したいと思います。今のところアイデアなので、実用性は？です。 方法 HTML に以下の style 要素を挿入することで実現することができます。 <style type="text/css"> * { display: expression(function() { if (!this.__mark) { this.__mark = true; alert('inserted node: ' + this.tagName); } return ''; }.apply(this)); } </style> 実際に例を見てみましょう http://amachang.art-code.org/ieexpression/000.html <!DOCTYPE
CSSレイアウトの定石 WinIE6バグ回避法
CSSを使ったレイアウトをする際にWinIE6のバグを回避するための「定石」をまとめておきます。 とくに重要だと思うものは強調してあります。参考としてバグ辞典へのリンクも用意しました（つまり回避法を用いない場合にどんなバグが発現するか）。 フォントサイズ関係 font-sizeは%かpxで指定する。 キーワードで文字サイズを指定すると標準モードと互換モードで文字サイズが変わる(IE6) em単位で指定した値が文字サイズ変更後に正しく反映されない(IE6) ボックスモデル関係 widthと同時に左右borderや左右paddingを指定しない。heightと同時に上下borderや上下paddingを指定しない。 ボックスの幅や高さを算出するときにパディングやボーダーのサイズを含めてしまう （ブロックレベル要素を内包するボックスにはpaddingを指定しない。） 左右ボーダーとパディングを設
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Box Sizing Behavior (WebFX)
IE8ハック - neotagの雑文
IE expression メモ - Cyokodog::Memo