脱 三日坊主 宣言！

NN4 すっぴんの刑から MacIE5 を救出

皆さん御存知の通り、NN4 は CSS への対応が不完全で、IE と同じような表示にしようとすると、ブロック要素を <div> で二重に囲むなど、HTML にかなりの小細工をしなくてはならず、いわゆる DIV 病になってしまいます。(この際、IE もバグだらけというのは無視して下さい)

そこで、この日記と掲示板では head 要素内の link 要素に screen 以外の media 属性を付けることで、すっぴんの刑 に処しています。

ところが、外部スタイルシートだけでなく、そのページにだけ有効なスタイルを head 要素内に style 要素としてそのまま書き込むと、そのスタイルだけが有効になってしまいます。そこで、「@media 規則を理解できない」というバグを使って、全ての規則集合を @media all { 〜 } で囲めば、NN4 を「すっぴんの刑」に処する事が可能です。(メディアタイプは all でなくても構いません)

しかし、@media 規則の利用には大きな落とし穴があって、MacIE5 も弾いてしまいます。そこで、MacIE5 を救出する為にもう一工夫必要になるのです。

その工夫というのが、MacIE5 の「スタイルシート内でバックスラッシュ ( ¥ ) の直後にある文字が無視される」というバグを使います。バグを回避するために別のバグを使うなんて、「毒をもって毒を制す」って感じでしょ。パズルみたいで楽しくないですか？　以下のサンプルを使って、その手順を説明しますね。

/* NN4 を「すっぴんの刑」に処す！ */
@media screen,tv {
  .bbs2ResForm {
    font-family: "ＭＳ ゴシック", osaka-等幅, sans-serif;
  }
}

まず、NN4 回避のための記述部分の最初の @media screen, tv { を /* ¥*/@media screen, tv {/* */ に変更して下さい。

通常、スタイルシート内の /* 〜 */ はコメントとして扱われますから、その中の ¥ はエスケープ記号ではなく普通の文字として扱われます。しかし、MacIE5 は、それをエスケープとして扱ってしまいます。(これがバグです)　従って、NN4 では前後のコメントが正しく認識され、@media screen,tv { が有効になりますが、MacIE5 では、¥ の次の * がエスケープされ、*/ が無効になりますから、次の */ が出てくる行末までがコメントとなり、@media screen,tv { は無効になります。

同様に、一番最後の行の } を /* ¥*/}/* */ に変更して下さい。これは上記の記述と整合性を持たせる為です。

この変更により、NN4 を含む通常のブラウザでは、@media screen,tv { 〜 } に規則集合が入っていることになり、@media 規則を理解できない NN4 ではスタイルが適用されなくなりますし、MacIE5 では、規則集合が @media screen,tv { 〜 } 内に書かれていない事になるので、スタイルが適用されます。

まとめると以下のようになります。

/* NN4 のみを「すっぴんの刑」に処す！ */
/* ¥*/@media screen, tv {/* */
  .bbs2ResForm {
    font-family: "ＭＳ ゴシック", osaka-等幅, sans-serif;
  }
/* ¥*/}/* */

なお、コメント部分を /*\*/ や /**/ と書くと、一部のブラウザで正しくコメントと認識されないかもしれません。ですから、なるべく /* \*/ や /* */ のように書いて下さい。

以上です。判りやすい解説かどうかは自信が有りませんが、宜しければ参考にどうぞ。

MacIE をお使いの方へ

上記の記事で blockquote 要素内の整形の為、行頭のインデントに、改行禁止スペース (   ) を使っています。表示上は問題なくても、そのままコピー＆ペーストすると、上手く半角スペースに変換されず、文字化けになるかもしれません。

御注意下さい。(u_u)

散髪

髪を切りました。そうとうバッサリと。

と言っても、暫く散髪に行ってなかったから伸び過ぎていた髪を切っただけで、失恋したわけじゃないですよ。一瞬期待した貴方(誰？)、イジワルですね。(笑)　本当の理由は、来週、ある式典に出席するんです。その件に付いては当日の日記にて。

ほんと、冗談抜きで、かなりの長さを切りましたよ。お陰で非常に軽いです。でも、ただ一つだけ難点があるとしたら、頭が寒い事ですね。(笑)

サイトの更新

この日記で CSS の実験をやってるだけじゃダメですね。いいかげん、コンテンツの充実を図らないと、「表具師という仕事を知ってもらう」と言う、このサイトの開設目的が永久に達成できないような気がします。

あと、HTML もかなり DIV 病の症状が出ています。これは、一つの CSS で NN4 でも同様のデザインを実現しようとした名残なので、NN4 用の CSS を用意するか、この日記のように適用を除外するかを決めて、1/7 の宣言どおり、スッキリさせたいと考えています。( XHTML への移行はまだまだ先のお話ですが…)

それと、改善すべき点も見えて来たので、NN4 を切り分けるついでに、CSS も見直さなきゃならないって思っています。いつまでも test.css ではダメですからね。(笑)

Кудрявка

FM OSAKA (85.1MHz) のサイト内に有る aiko's homepage に、ほぼ１週間に１回、aiko さんからのメッセージが掲載されます。その先週分のメッセージに「Кудрявка(クドリャフカ)」の話が書かれていました。そして、今週分のメッセージで彼女が見たサイトを紹介していました。彼女が見たのは Kudryavka という FLASH ムービーです。皆さんも一度御覧になって下さい。

文明が発展したり、生活が向上する裏には、多くの生き物が犠牲になっているという事を考えさせられる内容でした。人間に限らず生物は生きて行く為には多くの生命を奪わなければなりません。「食べる」という行為が最たるものです。たとえ菜食主義であっても、植物の命を奪っている事には変わりありません。牛や豚などの家畜は、人間に食べられる為に神様が用意してくれたものではないのですよ。いわゆる実験動物もそうです。マウスやラット、ウサギ、ネコ、イヌ、サル等も、人間の生活を向上させる為の犠牲になっています。命の重さは人間と他の生き物との間で変わるはずがありません。私達が直接殺していなくても、肉や野菜を食べたり、薬や化粧品などを使う事で間接的に殺生を行っているのです。その大切な命を犠牲にする事で生かされていると考えれば、食べ物を粗末にしたり、薬を乱用したり、環境を破壊したり出来ないはずです。ましてや自分の命を粗末にする事など考えられないと思うのですが…。

来週には消えてしまうメッセージなので、彼女の主張を一部引用して残しておきます。

なんとも、やりきれない話で涙が出たよ。
愛犬家も最近は増えてきたね。でも。
その愛犬家が使っている口紅やリップクリーム
目薬に化粧水に頭髪料をより良い物にする為に実験台にされる犬もいる。

とっても難しい問題よね。これって。
ストレスの実験や、癌細胞の実験、その他色々あるけど
全部動物が犠牲になってる・・・・・・けど、私達はそのお陰で薬を安心
して飲んだりする事が出来る。
でも、やっぱりやりきれん・・・・はぁ〜むずい。

だから、私は全部かえるんじゃなくて、自分が出来る努力をちゃんとしよう
って思いました。
それはね、大切に動物を飼うとかじゃなくてそれ以前に
ちゃんと生きてゆこうと思いました。

本当にそうだと思います。皆さんはどう思われますか？

カスタマイズ王

「せっかく掲示板」には「カスタマイズ王！」という応募式のリンク集が在ります。掲載される基準は、初期サンプルの掲示板には無い事と掲示板の雰囲気が明るい事の２点らしいです。初期サンプルに似たデザインの場合は、HTML ソースをどの程度変更しているか等が審査基準になるのかもしれませんが、気楽に応募できるように、あまり細かな基準を設けていません。

ただ、上記のリンク集を見て頂けると判るのですが、「私、○○さんの気に入りました」という投票用アンカーが付いていて、人気の度合いが棒グラフで表示されるんです。これはプレッシャーですね。

この「日記」も新しいデザインにしたし、応募しようかと思ったのですが、スクリーンショットは IE6 での表示を使っているようですし、投票してくれる人も、殆どが IE5.5 以上だと思うので、投票をしてもらうには、まず、IE6 での見栄えに特化した CSS を作らなきゃダメでしょうね。あっ、その前に雰囲気を明るくしなきゃ掲載もしてもらえなかったりして…。(笑)

テスター募集

昨日から本採用になった「紅梅」ですが、実は Mac での表示テストを一切していません。なぜなら、我が家にある唯一の Mac は、LC630 で、CPU は、MC68040 です。Power PC を積んでいないので、IE も NN も 4.5 以上はインストールできませんし、Opera も Safari も使えません。

そこで、貴重な Mac オーナー様に、IE5 以上でのスクリプトと表示のチェックや、Gecko 系ブラウザで表示される文字の大きさなどのチェックをして頂きたいのです。

御協力、宜しくお願い致します。(u_u)

やっぱり

PowerBook G4 12" を買わなきゃだめかなぁ…。(欲しいけど高いよね。(T_T) )

雨の日曜日

昨日は良い天気だったのに、今日は雨が降っててちょっと寒かったです。春はいつ頃来るのでしょう？