IE

IEでデバック、検証する際に使っているものをピックアップしました。
改めてな部分満載ですが。

少しずつIEとは仲良くなっているものの、相変わらず苦労する時があるのですが、上記のモノは重宝してます。

先日ほぼ社内用ですが印刷用CSSを作成したので備忘録までに。
簡単な用件は社内向けということで、
・対象ブラウザ→IE6、Firefox3.x
・対象ページ　→簡単な計算式の結果画面

そんなところで、とりあえず印刷できればいいという感じでした。
なんで、即席ですが大体以下のようになりました。

/*print*/
@media print {
body  {
      background:#fff;
      color:#000;
      font-size:12pt;
      zoom:87%;/*ie*/
}

不要な画像 {
      display:none;
}

モノクロ以外の色がついているテキスト {
      color:#000 !important;
}

table,
tr,
td {
      border-collapse:collapse;
      border-spacing:0;
      border:1px solid #666;
}

}

もっといろいろと指定していますがざっくりとこんな感じです。
ポイントは、
・IE用にzoom指定
・不要な画像は非表示
・色はモノクロに
・リンクは非表示または、underlineを付けたりアドレスを出したり
ぐらいですかね。後は必要に応じて線を入れると見やすくなるときもあります。
注意すべきは、印刷用としてファイルを分けていないので、このやり方だとMac版IEでは認識してくれないみたいです。

あまり印刷用CSSを作成する場面はないので、頼まれるごとに戸惑いますが、印刷したときに自分の思い通りに印刷されるととても気持ちがいいです。

先日遭遇したので備忘録。
コーディングがある程度してふとIEで確認すると絶対配置した画像が消えていたのでとても焦りました。自分の中ではabsolute指定するとまあブラウザのどこかにいるだろうという考え合ったのですが、border指定しようが、background-color指定しようがいなかったです。いろいろと調べてみたところ、position指定する前後のfloatしているものやhasLayoutが絡んでいるみたいです。

とりあえずclearをしたら回避できました。
まだまだ知識不足ですが、こういうのに遭遇できると楽しいです♪

上記のように「Yahoo! JAPAN」の検索窓に
「トランスフォーマー!」と入力して検索すると…。

全文を読む

久々に「これイイ！！」というものに出会いました。会社の人に教えてもらったのですが、これさえあればIEのチェックは問題ないようです。他にもスタンドアローン版やIE3ぐらい〜IE6までセットになったものを使用したことはあるのですが、これは確認するときに緑のボタンをクリックすればすぐさま確認ができますし、パソコンに変なソフトをインストールしたりする必要もありません。
今後は有効に使っていきたいと思います。