IE6対応のHTML5とCSS3のテンプレート「HTML5 ★ Boilerplate 」 | Web活メモ帳
「HTML5 ★ Boilerplate」はHTML5とCSS3で作られてテンプレートです。 基本構造の勉強や、汎用的なテンプレートとしてかなり使い道がありそうです。 と言うもの、iPhone、iPadなどのモバイル端末に対応している事。また、HTML5未対応ブラウザへの対応もされているため、汎用的に使えるのではないかと思っています。 業務案件にも使えそう 実際にHTML5が業務案件として使われるには一昔前のブラウザにも対応する必要があります。 その点、HTML5 ★ BoilerplateはIE6から最新のブラウザまで対応しているので、業務案件でも使えそうです。 PNG対応などの基本的なものから、CSS3、JavaScriptの実装対応など多岐に渡って対応されているようです。 興味ある方はぜひ使っても見てください！
【CSS】CSSレイアウト時のIE6対策まとめ | バシャログ。
Adobe の CS5 はなんか凄そうですね。「でもお高いんでしょ？」「ハイ、とても！」 いま会社で使っているアプリは「Macromedia」の Dreamweaver8 と Fireworks8 です。結構バリバリ制作作業していますが、別に不便に感じてないしなー、と思っている sakai です。自宅では Dreamweaver4 と Fireworks4 です。エヘン。 世間では HTML5 や CSS3 の話題も増えてきた今日この頃ですが、実務では相変わらず IE6 との格闘が続いています。 ただ、長年さんざん IE6 対策に取り組んできたこともあり、今ではそれほど IE6 を意識してコーディングすることもなくなりました。 今回は IE6 をターゲットに含めた CSS レイアウトで気をつけたい点をまとめました。 基本ですが、おさらいまで。 大前提 大前提として、IE6 は標準準拠モード
IE6 が死んだらできる10のこと（from Ajaxian） - oogatta のブログ
という記事がその昔 Ajaxian に挙がっていたので自分のメモとして残っていたモノを、そろそろ時期が来たかと言うことでこちらに再掲。 http://ajaxian.com/archives/10-cool-things-we%e2%80%99ll-be-able-to-do-once-ie6-is-dead-and-a-few-we-cant 子セレクタ（child selectors）が使えるようになる。 孫以下を除く直の子にだけ適用するセレクタが使えるようになります。 #bodyMain > p {} ul > li 24bit PNG の機能を全て使えるようになる。 アルファチャンネル付きPNGがネイティブで使えます。アンチ付き角丸を背景色毎に用意する必要が無くなります。 属性セレクタ（attribute selectors）が使えるようになる。 感覚的にいって class の3割
SleepingSnow - jquery.bgiframe（IE6で他の要素と重なっているselect要素を隠す）
マウスオーバーやクリック時に現在表示している画面へ重なるようにブロック要素が表示されるjQueryのプラグインを使用する際、ブラウザがIE6だとz-indexを指定してもselect要素が隠れずに最前面へ表示される場合があります。 この場合、前面へ表示したいブロック要素へbgiframeプラグインを適用することで、select要素を隠すことができます。 なお、IE7からはこのバグは修正されているため、適用する必要はありません。 また、FirefoxやChrome、Opera、Safariなども正常に表示されます。 イメージは左がIE6、右がIE7で、イメージ内のDiv要素は上が適用前、下が適用後です。 jquery.bgiframe.min.js Licence: MIT/GPL 本家はよく判らなかったのですが、おそらく下記のGoogle Codeが最新だと思われます。 http:
IE6よさらば：CSS 3分コーディング
CSS（スタイルシート）の色々なテクニックや知識を紹介していく「CSS 3分コーディング」のコーナーです。 はじまりはじまり。 既報の通り、Googleは段階的にIE6のサポートを打ち切ると発表しました。 また、欧州では政府機関が公式にIE6からの乗り換えを推奨するなど、IE6のシェアは徐々に低下しています。 日本でもこの流れは同様ですが、企業のサイトなどがサポート外のブラウザーとするにはまだ勇気が必要かもしれません。 しかし、IE6を考慮しないだけでWebサイト制作はガラリと変わります。 IE6の問題点は様々ですが、中でも未実装のセレクタが多数ある点が非常に痛い点です。IE6を考慮しなければ次のようなセレクタが使えます。いずれの方法もIE6をサポートする場合はIE6を考慮するのであれば、対象の要素にclass属性やid属性が必要になります。 親要素 > 子要素 { プロパティ:値 } 子
[CSS]ハック無しでIE6でmax-widthを実現するスタイルシート
CSS HackもJavaScriptもIEの条件付きコメントも無しで、IE6でmax-widthを実現するスタイルシートをCSSplayから紹介します。 'max-width' for Internet Explorer IE6 demo: center 実装のポイントとなるのは左右に配置されたdiv要素で、それぞれマイナスマージンを指定します。 コンテンツを配置するdiv要素には「overflow:hidden;」を指定します。 デモでは上記のmax-widthのコンテンツをセンターに配置したものと左右に配置したものがあります。 'max-width' centered 'max-width' left 'max-width' right
IEでのCSSのバグを回避するhasLayout | コリス
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のバ
Lucky bag::blog: IE で min-width を指定する方法
IE は min-width に対応していないんだけど、「Stu Nicholls | The CSS Playground」でスクリプトを使わず CSS だけで擬似的に min-width を指定する方法が紹介されていたんで、ざっくりとご紹介。この方法は、Win IE のみに効く方法で、Mac IE では機能しない模様。サンプルとして下記の (X)HTML を使用してみる。 <div class="container"> <div class="box"> <div class="contents"> 内容 </div> </div> </div> これに対して、幅 90% で最小幅 400px の指定をしてみる。IE5.5 と IE6 に対応したパターンと IE5.01 と IE5.5 と IE6 に対応したパターンの２種類の方法がある。 実際に試してみたサンプル IE5.5 と IE
IE6でmin-widthを実装する方法のまとめ - Webtech Walker
先日書いたmin-widthとmin-heightに関する記事の補足です。以下のようなコメントをいただいたのでIE6でmin-widthを実装する方法をまとめました。 たしかに、この方法に若干違和感感じあります。 例えばどういう実装方法があるのでしょうか？ あまり使う機会がないもので。 javascriptのライブラリを使う ライブラリを使う場合は下記などがあります。お手軽です。 min-width,max-width,min-height,max-heightをIEで使えるようにするjavascript[to-R] expressionで実装する expressionを使って、CSS内でjavascriptを使う方法だとかなりシンプルに書けます。 [CSS]IEで、min-widthやmax-widthを実現する方法 | コリス #foo { min-width: 600px; widt
ITキヲスク | IE6の頻出CSSバグいろいろと、それに対処するハック術
CSSコーディングにおいて最も忌むべきもの、それはIE6。 「ホントに仕様書読んで作ったのか？」と疑いたくなるほどのオリジナリティ溢れるCSS解釈は、IE6の絶大なシェアとも相まって、一層容赦ない問題となりました。 世には様々なハック術や回避方法が出回るも、それ自体がIE6のバグを利用したモノだったりして、IE立てればOpera立たず、みたいな状況に脳ミソとろけた経験のある方も多いのではないでしょーか。 今回のエントリーでは、そんなIE6で頻出するCSSバグと、それを対処 / 回避するハック術なんかを取り上げてみたいと思います。 これでもうIE6なんざ怖くない!? IE6の頻出CSSバグと対処ハック術 1.横方向のmarginが倍になっちゃうバグ。 恐らく最も引っかかるであろう、この凶悪なバグ。 このバグに見舞われてしまう条件はものすごくカンタンで、「floatさせた要素に、floatした
IE 6とIE 7のためのCSSハック16選（1/3） - ＠IT
有限会社タグパンダ 喜安 亮介 2009/11/17 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック＆フィルタTipsをお届けします（編集部） Webブラウザ別CSSハック一覧表 前回の「IE 6で泣かないための、9つのCSSハック」では、仕様通りの正しいコーディングを行っているにもかかわらず、Internet Explorer（以下、IE） 6で見ると、レイアウトがズレてしまうなどのさまざまな問題を解決するための9つのテクニックを紹介しました。 今回は、IE 6とIE 7のためのCSSハックのテクニックを下記に分けて紹介します。 IE 6をハック（IE 6のみに効く、もしくはIE 6のみに効かないハック） IE 6のみに効くハック スタ
IE6、IE7、IE8におけるCSSの違いまとめ | エンタープライズ | マイコミジャーナル
IE? - IE6, IE7 and IE8 Net Applicationsの報告によれば、2009年9月におけるブラウザシェアはIEが65.71%で過半数のシェアを確保している。バージョンごとにみるとIE6 24.42%、IE7 19.39%、IE8 16.84%となっており、IE6、IE7、IE8のシェアが拮抗しつつあることがわかる。これまでのシェア変動から推測すると、今後数ヶ月の間は3つのバージョンのIEが似たようなシェアを持った期間が続くことになる。IEが第一シェアだといっても、結果的に3つのバージョンに対応する必要がある。 この状況は、特にCSSのサポートという面で厄介な状況を生み出している。IE8はCSS 2.1への高い準拠を実現しているが、IE7はそうではない。IE6はサポートしている要素やプロパティがさらに少ない。またIE7やIE6は対象の要素やプロパティをサポートしてい
『float指定で発生するＩＥ６のバグ「余白２倍」を解決する方法』
本を買わずに解決するWeb制作の小技 ホームページ作成でちょっとしたことを参考書を買わずに解決する方法をPHP CSS Webデザイン jQuery Flashを中心に便利な技をまとめていきます！現在、長野県長野市の制作会社でWeb作成中！ 今月２００９年９月号のWeb Designingを読んでいて よく出会うフロート指定でＩＥ６のバグ「余白２倍」に 関する記事がありました。 ＩＥ６のバグ「余白２倍」とは、floatとmarginを 組み合わせたときに同じ方向に指定されている場合に ＩＥ６だと余白が２倍になって表示されてしまいます。 私は今まで回避方法として padding を使って いたのですが、違うやり方が紹介されていた のでメモ 解決方法１ floatした要素ではなく子要素にmarginを指定する 解決方法２ display:inline;を指定する ＩＥ６でfixedさせる方法と
IE 6で泣かないための、9つのCSSハック (1/3) - ＠IT
有限会社タグパンダ 喜安 亮介 2009/10/8 Webブラウザごとのレンダリングエンジンの違いにより起こるレイアウトの表示ずれ問題に泣かされるWebデザイナのために、Webブラウザごとに使えるかどうかの表を交えながら問題を解決するためのCSSハック＆フィルタTipsをお届けします（編集部） 最も多く使われているのに……、いや、だからこそ 多くのWebデザイナの悩みの1つは、レイアウトの表示ずれ問題だと思います。これは、各Webブラウザが採用しているレンダリングエンジンの違いから起因している場合が多いです。その中でも、最もWebデザイナ泣かせのWebブラウザなのは、マイクロソフトが開発しているIE（Internet Explore）のバージョン6です。 IE 6は、発売開始当初のWindows XPにデフォルトでインストールされていたWebブラウザということもあり、世の中の多くのユーザー
css-eblog.com - このウェブサイトは販売用です！ - css eblog リソースおよび情報
This webpage was generated by the domain owner using Sedo Domain Parking. Disclaimer: Sedo maintains no relationship with third party advertisers. Reference to any specific service or trade mark is not controlled by Sedo nor does it constitute or imply its association, endorsement or recommendation.
「Windows IE6, IE5.5 で透過pngを使う」の決定版｜WEB制作（html,css(スタイルシート) )｜プログラムメモ
IE6,5.5で透過pngを表示させるため、今まで様々なスクリプトが開発されてきましたが、 とうとう決定版が出現。 ■ DD_belatedPNG http://www.dillerdesign.com/experiment/DD_belatedPNG/ ここからダウンロード。 /js/ に D_belatedPNG.jsをアップロードして、 <!--[if lte IE 6]> <script type="text/javascript" src="./js/DD_belatedPNG.js"></script> <script type="text/javascript"> /* EXAMPLE */ DD_belatedPNG.fix('.png_bg'); </script> <![endif]--> とするだけでOK。 DD_belatedPNG.fix('.png
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
IDEA * IDEA
http://blog.e-riverstyle.com/2009/10/iecsscss.html
はてなブログ | 無料ブログを作成しよう
http://www.virtuosimedia.com/tutorials/ultimate-ie6-cheatsheet-how-to-fix-25-internet-explorer-6-bugs