IEで「レイアウト崩れが起きてます」と言われた時の対処メモ（Internet Explorerの「互換表示モード」を解除する）
HOME>Web>IEで「レイアウト崩れが起きてます」と言われた時の対処メモ（Internet Explorerの「互換表示モード」を解除する） 業務でやっているとある企業のWebサイト（レスポンシブ対応、対象ブラウザ：IE9〜）構築で、こちら側のブラウザチェックでは問題ないのにクライアントから「こちらのPCで表示が崩れるんですが…」との連絡が。 対応していないCSS3プロパティの効果が見えないとかならまだしも、レイアウトがグチャグチャになっていると言われては冷や汗が止まりません。 しかも、制作側ではどのPCで見ても問題ない上、対応していないIE8ですら問題ないというのに…これは困った。 ie8で崩れぬ表示 クライアント先のie9で崩れている そんな悪夢（バグ）の波間で 終わらない旅路（デバッグ）を続ける堕天使（わたし） 虚しさの意味を知る 柔らかな風が吹くこの場所で… （GLAY/HOW
display:inline-blockがけっこう便利。だけど…
小さいブロック要素とかを横並びにさせたいときとか、inline-block使うと便利なんですよね。幅も高さも指定できてしまう要素にみせることができるinline要素になるというのがとても便利。わざわざblock要素にして、floatさせて横並びにさせる、そして並ぶ要素を終わらせたあとはclearをして…なんてことをしていると、指定が多くなってしまうんですよね。ですが、inline-blockを使うと、そんなことしなくても簡単に並べちゃうってのはいいですよね。 しかし、そのinline-blockは、IEやFirefox2などのオールドブラウザだとうまく動作しないことの方が多い。今では使えるようになっているブラウザが多いのですが、IEや以前のブラウザを気にすると、使いどころが少なかったりもする。 inline-blockのオールドブラウザやIEについての動作は、参考としているサイトを見てもら
CSS3でIEにも角丸を適用させるhtcファイル – creamu
CSS3で最も簡単にクロスブラウザの角丸を実装したい。 そんなときにおすすめなのが、『curved-corner』。CSS3でIEにも角丸を適用させるhtcファイルです。 Google Codeで、CSS3でIEにも角丸を実装させるファイルが配布されていますね。 クロスブラウザの角丸を実装するには、「border-radius.htc」ファイルをダウンロード、配置して、CSSに以下のように記述すればOKです。 CSS3 -moz-border-radius: 32px;//for Firefox -webkit-border-radius: 32px;//for Safari and chrome border-radius: 32px;//CSS3 behavior: url(border-radius.htc);//for IE すごく簡単な方法なので、CSS3での角丸はこれで決まりな
higash.net
higash.net 2018 Copyright. All Rights Reserved. The Sponsored Listings displayed above are served automatically by a third party. Neither the service provider nor the domain owner maintain any relationship with the advertisers. In case of trademark issues please contact the domain owner directly (contact information can be found in whois). Privacy Policy
IE8バグ？：a要素内に画像があってa要素に背景を指定した時に位置がずれる
キャプチャ見てもらうと分かるようにIE8だけ極端に位置がおかしい。 IE8がリリースされてから、まだあんまりいじってないのでよく分かってないのですが、今組んでいるサイトをIE8でチェックしたら、「あれ？表示がおかしい...」って事に遭遇してしまったので、エントリー。 よくある感じで、リストのマーカー変わりに背景の指定をa要素にして、そのリスト内には画像テキストが入ってたんです。はい。 毎度のようにサンプルも用意してみました。 サンプルを見る 発生条件は調べた感じa要素内にimg要素があって、a要素にbackgroundプロパティの指定をした時に起こる感じです。 img要素にテキストが隣接してても同様でした。 サンプルみたいなデザインの場合、マーカー部分も一緒に切ってしまう事が多いから過去の案件は大丈夫だと思うけど・・・ 取りあえず、今回のサンプルに使ったソースは以下です。 <ul> <li
<ol>要素に於けるファイヤーフォックス等でのバグ対策 - CSS小技集
CSSの小技として、<ol>要素に於いて見られるファイヤーフォックス等"もじら系ユーザエージェント"のバグへの対策です。 ファイヤーフォックス等にはどのようなバグがあるのか。(平成19年 6月 1日 更新) 現行のファイヤーフォックス(ヴァージョン 1.5.x.～2.0.x.)等の"もじら系ユーザエージェント"では、ある条件で<ol>要素に於いてバグが発生します。 具体的には、 <ol>要素の孫以下の要素(子要素は必ず<li>要素ですね)にdisplay: list-itemプロパティが与えられた<li>以外の要素が含まれていると、その要素の分だけカウントが増えてしまう。 と言うものです。 後で調べたところ、初期のネットスケープ 6.01(まだファイヤーフォックスの原型さえなかった頃のもの)でもこのバグがある事が分かりました。(平成19年 6月 1日) 具体的なサンプル。 ちょっと分かり難
)
バージョン ベクタ
注 : このドキュメントは暫定版であり、変更される場合があります。 バージョン ベクタは、ブラウザの起動時に読み取られるレジストリ キーに格納されている、Windows Internet Explorer の内部バージョン番号を表します。Web 開発者は、バージョン ベクタを使用して、閲覧者が Web サイトの表示に使用しているブラウザを検出できます。ブラウザ検出のベスト プラクティスを理解することで、Windows Internet Explorer 8 クライアントによって表示されるときに、サイトが意図したとおりに動作を続けることを保証できます。 このドキュメントでは、Windows Internet Explorer でバージョン ベクタの値がどのように使用されるかについて説明します。また、推奨されるブラウザ検出手法の実装およびメンテナンスについて、Web 開発者を支援するためのコー
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ブラウザということもあり、世の中の多くのユーザー
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のバ
IE7のズーム機能でバグる - hasLayoutとは | Takazudo Clipping*
IE7のズーム機能を使うと、ラジオボタンやチェックボックス、文中に入れた画像がおかしくなります。こんな風に。 <input type="radio" />ウェブ全体から検索 <input type="checkbox" />日本語のページを検索 <img src="/clip/cmn/img/entry-bg-01.gif" />オマケ IE7のズームで崩れるサンプル これを直す方法。 IE6までは、問題のある要素にheight:0を指定するという、holly hackと呼ばれるバグ対処方法で、数々の問題のあるバグが解決されてきました。IE7になっても、コレに変わり、min-height:0を指定すれば直るじゃん！と思ってました。 しかし、その方法でもこれは直らない・・・。他のズーム機能のあるブラウザではこんなこと起こらないのに、どうすればいいか到底見当もつかない・・・ひどすぎるIE7・・
ブラウザバグ回避用CSSセットアップ / IEバグ対処フロー | Takazudo Clipping*
暇だからCSSのセットアップでも載せとく。 CSSレイアウトで問題になるのは、ブラウザごとにバグがあって、それに対応するのにどうするかっていうのが一番困る。でも、ブラウザごとにっていっても、実際に問題があるのは、ネスケ4とかIE4とかMacIEとの本当に古いブラウザと、バグの多いけどまだちょっと使っている人がいるIE5、IE5.5、まだまだこれからも高いシェアを続けていくIE6と、かなりましになったけどまだちょっと問題のあるIE7を、なんとかすればいい。逆に言えば、これら以外のブラウザには、フツーに何の仕掛けもなしに、きちんと表示される必要がある。FirefoxとかOperaは、かなりきちんと表示してくれるから。 要するに問題なのはIEばっかりなんだけれど、FirefoxやOperaできちんと表示されていれば、IEでボロボロになってても、大して心配はない。一定の流れでバグ回避をしていけば
異なるブラウザでフォントサイズが同じに見える方法を実験してみた: 世界中の１％の人々へ
2009年11月| 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 文字サイズ100%でもブラウザによって基本文字サイズが違う。 画像は、このブログを異なるブラウザで開いたスクリーンショットを比較できるようにしたもの。左からInternet Explorer 8.0、Firefox3.5.5、Opera!10.01、Safari4.0.4、Google chrome3.0.195.33で、すべてWindows。 Firefoxの文字サイズが小さいことが一目瞭然。 CSSはこう指定してある。 ◇ベースフォントCSS body { font:100%; arial,helvetica,clean,sans-serif;←モダンブラウザ用 *font-size:medium;←IE
Thematic WordPress Theme Toolbox: 10 extremely useful hooks
This page provides an overview of all important pages on CatsWhoCode.
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
深刻な脆弱性が見つかったInternet Explorer（IE6～11）を巡り全国各地の社内がコントでカオス : 市況かぶ全力２階建
403 Error - Forbidden
IDEA * IDEA