以下のように記述すると IE6 でだけ無駄な改行が発生します。いつもながら独自の世界を駆け抜ける IE シリーズには楽しませていただいております。

1
2
3
4

<ul>
<li><span style="display:block;">テキストA</span></li>
<li><span style="display:block;">テキストB</span></li>
</ul>

解決策は一つ目が以下のように HTML を書く段階で改行させない方法。まぁ IE6 のために時間を潰すのは面倒なので、とりあえず一応以下のように書いた方法だけで正常に表示されるのを確認しました。

1

<ul><li><span style="display:block;">テキストA</span></li><li><span style="display:block;">テキストB</span></li></ul>

あと二つ目は li に padding: 1px; を指定する方法です。隙間が入ってうまい具合にデザインできないのでイライラしますねー。

私は個人制作では IE6 で li の中にブロック化した要素が入っているコンテンツは非表示にします。もしくは放置します。たぶん IE6 を使っている人はこのブログを読んだりしないと思うし、IE6 をバリバリ使ってる人に読んで欲しいとも思わないーなんてことを思ってるわけでもないですが…(笑) 心の奥底では思ってるかもしれませんね…。

IETester は IE5.5 IE6 IE7 IE8 を同時に確認できるアプリケーションです。IE6 で表示確認するためにわざわざ XP を起動したりする必要もこれでなくなります。

IETester をダウンロード

これがなければ IE6 と IE7 を同時に PC 内で起動したり、IE6 の入った PC を別で起動したり、IE5.5 での表示確認は諦めたりといろいろ大変なことばかりだったと思います。これで IE の脅威を半分くらいに抑えられますね。

ちなみに更新をするとページが表示されなくなったり、一定時間たつとエラーで終了してしまったりといろいろ問題もあるみたいなので、完璧とは言えないです。でも少しずつ Web 全体も進化してきてるみたいで毎日が楽しいですねぇ。自分も早く人の役に立つものを作って、世界をよりよくしたいです。

IE では border で 1px の点線を引くと、スクロールしたりしたときに線と線がくっついて見栄えが悪くなってしまうことがあります。私は Firefox では問題なく表示されるし、たまにしか表示されないので気にしていなかったのですが、今日お客さんから直してくれと頼まれたので直すことになりました。

わざわざくっつかない線を表示するために画像を使うのは嫌なので、CSS でなんとか出来る方法を探していたら以下の方法を発見しました。
タグメモのカケラ | IEで、ボーダーがうまく表示されない

点線を指定している id や class に対して position: relative を指定すると良いそうです。

1
2
3
4
5
6

hoge {
margin: 10px 0;
padding: 10px;
border: 1px #dddddd dashed;
position: relative;
}

でも私の環境では何も解決されませんでした。解決できなかった人は border を 2px にしたりすると解決されますのでいろいろ試してみるのも良いかもしれませんね。何か他にも方法があったら教えてほしいです。

IE6 には box の中で float を使うと背景画像が欠けてしまったり、ずれて表示してしまうなどのバグがありますです。このバグは box に width を指定することによって解決できるようです。

普通のプログラムのようにアンインストールすることができませんでした。
VISTAの場合なら、コントロールパネル→プログラム→インストールされた更新プログラムを表示→Windows Internet Explorer 8を選択してアンインストールできます。

Google で「カロリー」と検索すると検索結果の2番目に出てくる驚異的な個人サイト「食品の摂取カロリー計算」は知らない人はいないほどカロリー系のサイトの中では有名です。このサイトを見習って、私のサイトにもカロリー計算コーナーを設置したいと思います。 (続きを読む…)

IE6はアルファ画像(透過png)が使えませんが、今回紹介する方法で簡単にIE6でもアルファ画像を使うことができるみたいなので、いつも通りメモしておきます。
ちなみに透過を活用することによって、さらにデザインの幅が広がるかもしれません、あー楽しみかもです。透過を活用したウェブデザインは以下のサイトでいろいろ紹介されています。
透過をきれいに使ったウェブデザインいろいろ | DesignWalker (続きを読む…)

今回はIE PNG Fixを使ってみたので、使い方をついでにメモしておきました。ちなみにIE PNG Fix 2が去年登場してるみたいなので、ここではIE PNG Fix 2の使い方を紹介します。
IE6 透過PNG表示、IE PNG Fix 2登場 | エンタープライズ | マイコミジャーナル (続きを読む…)

IE6 に対する怒りが増し、だんだんと Microsoft に対して良い気持ちが持てなくなってきました。今回はカロリーデータベースの構築中に、こんなことも正しく解釈できないのか……と思わせるほど、あるはずがない、あってはいけないと思ってしまうほど致命的なバグで忘れやすいものを(自分専用に)まとめてみました。 (続きを読む…)

子供セレクタはIE6では使えないようです。このブログでいくつか使用していたため、IE6ではとんでもないレイアウトになってしまいます。
セレクタ（selector） CSS 前提知識

あとmin-widthも使えない。これによって、いろいろとやりたいことが制限されます。このブログもmin-widthが使えないがために、IE6では横幅を強制的に指定することになってしまいました。できるだけFirefoxやIE7などで見てほしいです。

ちなみにmin-widthをIE6で実装する方法について、とても分かりやすくまとめてあり、大変参考になりました。
IE6のmin-width、min-heightハックに関して – Webtech Walker
IE6でmin-widthを実装する方法のまとめ – Webtech Walker

ちなみにNetscapeでも若干レイアウトが崩れます。Webデザインって難しい……。