[CSS]IE6でよく遭遇する6つのバグとその解決方法 | コリス
CSS Trickのエントリーから、IE6でよく遭遇する6つのバグとその解決方法の紹介です。 IE CSS Bugs That’ll Get You Every Time ボックスモデルのバグ マージンが二倍になってしまうバグ min-width, min-heihgtと同等の指定 Stepdownバグ hover擬似クラスをa要素以外にも対応 透過PNGを透過表示に対応 ボックスモデルのバグ <textarea name="code" class="css" cols="60" rows="5"> div#box{ width:100px; border:2px solid black; padding:10px; } </textarea>
IE6でよく遭遇するCSSのバグとその解決方法 | コリス
Dave Woodsのエントリー「IE6 -CSSのバグとその解決方法」から、IE6でよく遭遇する３つのCSSのバグとその解決方法の意訳です。 IE6 - CSS Bugs and Fixes Explained IE6で、マージンが２倍になってしまうバグ IE6で、hasLayoutプロパティによって起こるバグ IE6で、小さい高さを指定した場合に起こるバグ IE6で、マージンが２倍になってしまうバグ IE6で、フロートした要素のマージンが２倍になってしまうバグと解決方法の紹介です。 下記のコードで、IE6はマージンが20pxになります。 sample:バグ #navigation{ float: left; width: 200px; margin-left: 10px; } #content{ float: right; width: 500px; margin-right: 10p
CSS : IEとFirefoxの表示差異を改善したい
grandswellと申します。 よろしくお願いいたします。 サンプルをIE、Firefoxそれぞれで見ていただけると わかっていただけると思うのですが、Firefox側が 意図した通りのレイアウトになっていません。 サンプルをIEで表示したレイアウトを Firefoxでも同じCSSで実現するにはどのような 工夫が必要でしょうか。 ぜひご教示くださいますよう、お願いいたします。 以下、サンプルのCSSとHTMLとなります。 *cssサンプル(style2.css) ---------- div.main { border-style : dashed; width : 100%; } div.main div.contents{ border-style : dashed; width : 75%; float : left; } div.contents div.contentsmain
IT戦記 - 一行で IE の JavaScript を高速化する方法
以下の一行をすべての JavaScript の前に読み込む /*@cc_on _d=document;eval('var document=_d')@*/ この一行を読み込むことによって IE での document へのアクセスが 5 倍速くなります。 たとえば 以下のように、読み込む前と読み込んだ後を比較してみます。 // Before var date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date - date); // 643 /*@cc_on _d=document;eval('var document=_d')@*/ // After date = new Date; for (var i = 0; i < 100000; i++) document; alert(new Date -
ウノウラボ Unoh Labs: hasLayoutとは何か
yamaokaです。 CSSに携わっている方なら、Holly hackを使ったことがあるかもしれません。 /* Hides from IE5-Mac \*/ * html .foo { height: 1%; } /* */ Internet Explorer（以下IE）で、レイアウトに問題のある要素に 上記のようなスタイルを指定をすると、 あら不思議、まともな表示がなされるというものです （上記のままではIE7に対応していませんが…）。 さて、どうしてレイアウトが意図したとおりに行われるようになるのでしょうか。 IEのhasLayoutプロパティ IEでは、全ての要素が 「hasLayout」という読み取り専用のプロパティを持っています。 これはそれぞれの要素がレイアウト情報（＝要素の幅・高さなどに関する属性情報）を 保持しているかどうかを示す値で、 デフォルトの状態では「hasLayo
positon:fixedの代わりにCSS Expressionを使ってみた | 暴満館 ～The House of full Violence～
以前のエントリでheight:100%がよろしくないのでposition:fixedを使うようにしたいが、IE6は対応していない。ではどうするか。 幸か不幸か当サイトのIEを利用した閲覧者の多くがJavaScriptを有効にしているようなのでCSS Expressionという、CSS内でJavaScriptを使えるというIE限定のウル技を使うことにした。 expression() のまとめ このサイトを参考に以下のように記述。 body { filter : expression(''); } #navi { position : expression( 'absolute' ); top : expression( body.scrollTop + 10 + 'px' ); } bodyのやつはチラつき防止だそうで、見事に固定された。もしJavaScript無効なら1カラムで表示。うむ、
IEで固定座標を指定する方法
さて、アナウンスしていたようにIEでposition: fixed;を実現する手法について簡単にまとめておきます。まぁこのテクニックもIE7が出るまでのつなぎです。やり方は大まかには2通りあって、純粋にCSS(スタイルシート)のみで指定する方法とJavaScript(正確にはMS独自のDynamic property ダイナミックプロパティーと呼ばれるもの)を使うやり方です。 まず、1.CSSのみの方法から １．基本的な考え方は、HTML(あるいはBODY)タグのスクロールバーを非表示にして、かわりにDIVタグ(HTMLならBODYタグ)のスクロールバーを表示させる方法です。具体的な記述は以下のようになります。 html { overflow: hidden; } body { height: 100%; overflow: auto; } 次に、固定表示したいDIVタグ(タグは何でも良い
R-Click! Union 拡張メニュースクリプトの作り方
IEの右クリックメニュー(コンテキストメニュー)は、レジストリの項目によって定義できます。オリジナルメニューを追加したい場合には、対応するレジストリエントリーを追加するだけです。 ちょー有名な技ですので。わざわざ説明することでもないのですが、投稿ページを作っている建前上、一応こんなページを作っておきます。 このページに書かれているようなことは、Microsoft Power Toysの説明ページ(日本語版)やうりゅさんちのサポート掲示板などからも入手可能です。 メニューのレジストリはHKEY_CURRENT_USER\Software\Microsoft\Internet Explorer\MenuExtにあります。 レジストリエディタなどで実際に確認してみた方が分かりやすいと思いますが、ここの直下のサブキー名が表示されるメニューそのものになっています。 (例) HKEY_CURR
IEとFFで同時にCSSを確認しながら編集できるフリーソフト『CSSVista』
異なるブラウザのブラウザチェックをもっと簡単にしたい。 そんなあなたにおすすめなのが、『CSSVista』。IEとFFで同時にCSSを確認しながら編集できるフリーソフトだ。 What is it? CSSVista is a free Windows application for web developers which lets you edit your CSS code live in both Internet Explorer and Firefox simultaneously. CSSVistaとは？ CSSVistaはweb制作者のためのWindowsアプリケーション。ライブにIEとFFのCSSを同時に編集できる。 とのことだ。 IEとFFといっても、バージョンにも対応している。IE4から6,NN4から8など、様々なブラウザ、バージョンに対応している。 ライブに、しかも異
IE7Pro Forum / Users Scripts porting : Simplify the work by this code (GM_ API)
// FremyCompany Script // version 0.1.3 BUILD 1 // // -------------------------------------------------------------------- // // This is a Greasemonkey user script. To install it, you need // IE Pro 9.12 or later (see at : http://www.iepro.com) // Then restart Internet Explorer and revisit this script. // // -------------------------------------------------------------------- // // ==UserScript==
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
