日記帳だ! with Tux on Libserver

今日は新サーバーの調整をしていた。まぁ部のなんだけどね。
そこで毎度難しいと思わせる問題、SSLの件について取り組んでました。
実はLibserverは未だにSSLに対応させてない。
まぁあった方がいいんだけど、ほぼLAN内での利用なのであまり気にしてない。
将来的にはやりたいが。
で、手順について、二度目にして体系化できた。
非常にわかりにくい説明で困るのだが、まぁなんとかつなぎ合わせれば簡単に作れますぞと。
ところで、今回作るのはオレオレ証明書と呼ばれるもの。
はてなに詳しい定義が載っている。
http://d.hatena.ne.jp/keyword/%A5%AA%A5%EC%A5%AA%A5%EC%BE%DA%CC%C0%BD%F1
これによると、僕が作ろうとしてるのは第四種オレオレ証明書とあるもの。
特定の人が利用するための証明書。
そのため真贋は実際に管理者にフィンガープリントを教えてもらってそれと比べればよい。
そういう考えなのであまり深く考える必要はない。
一応体面を考えて自分で認証局をたてて、それが鍵に署名をして証明するようにしましたが、
まぁ自己署名証明書でも事は足りるのだけどね。
まず自分で認証局をたてると
ところでCentOS 5.1の上での話をするが、当然だがRHEL、Fedoraでも通じる話。
他でもディレクトリが違うかもしれないだけ。
まず、/etc/pki/tls/certsに移動する。
それで、/etc/pki/tls/openssl.cnfを次のを参考に変更する。

[usr_cert]
nsCertType = sslCA, emailCA
basicConstraints = CA:TRUE
keyUsage = cRLSign, keyCertSign

参考にしろというのも変な書き方だが、まぁコメントアウト、コメントアウトの解除とかで調整してください。
それで、便利なコマンドがありまして、

# /etc/pki/tls/misc/CA -newca

これで適当に設定していけば完了。CA certificate filenameとかchallenge passwordはそのままEnterで。
これで/etc/pki/CA/以下にCA証明書が出来る。
で、ここから配るのに便利な形にCA証明書を加工する。
まずCA証明書は無駄な文言が多いので、いらない部分をカットしたスマートな証明書を作る。

openssl x509 -in /etc/pki/CA/cacert.pem -out /tmp/ca.crt

次にメールクライアントなどでよくつかわれるDER形式の証明書を作る。

openssl x509 -in /etc/pki/CA/cacert.pem -outform der -out /tmp/ca.der

最後にフィンガープリントを確認しておく。

openssl x509 -sha1 -in /etc/pki/CA/cacert.pem -noout -fingerprint

フィンガープリントというと意味は指紋だが、証明書のSHA1ハッシュですね。
この値をメモしておいて、この値を配って、証明書を登録するときに確かに正しい証明書か確認してもらう。
ただ、この値はネットワークで配信するのもいいのだが、アナログな手段で伝えられるようにするべきだと思う。
なぜかというとその公開するページがなりすまされては意味がないから。
それこそ政府とかの証明書は官報とかでフィンガープリントを発表するのだろうが。
で、とりあえずこれで認証局は完成。
この鍵を持って帰って、Firefoxとかに登録させてみる。
それで証明書を表示させてみて、認証局の中から探して、プロパティーで見てみると、「SSL 認証局」と出ているはず。
次に実際に使う鍵を作成。
また、/etc/pki/tls/openssl.cnfを次のを参考に変更する。

[usr_cert]
nsCertType = server
basicConstraints = CA:FALSE

で、次のコマンドを叩く。

# /etc/pki/tls/misc/CA -newreq

これで鍵ができた。この状態では署名されてない。
次に署名だが、非常に便利なもので、

# /etc/pki/tls/misc/CA -sign

とすれば完了。
これでnewkey.pem、newcert.pem、newreq.pemの3つがあるはず。
このうち、newreq.pemは署名の作業のために実は使われている。
newkey.pemはサーバー側で専ら使うもの、newcert.pemはユーザーに配るもの。
こちらはあまり気にしなくていい。Apache・Dovecot・Postfixが自分で配ってくれるから。
今回は1つのマシンの上でやったから何にもないが、認証局が別のマシンのときは
newreq.pemを認証局に持って行って、認証してもらってnewcert.pemを持って帰ってくるというやり方になる。
ところで、この状態ではnewkey.pemにはパスワードの暗号化がかかってるのだが、
この状態では自動起動で手間になるので、危険を覚悟で暗号化を解除しておく。

# openssl rsa -in newkey.pem -out newkey2.pem

このnewkey2.pemをApache・Dovecot・Postfixに鍵として読み込ませて使うということね。
まず手始めにApacheに登録させた。
さすがにCentOSはすばらしいもので標準でmod_sslが入ってる。
余談だがmod_deflateも入ってた、ちょこちょこ設定するだけで圧縮がかかるようになった。
それで設定は/etc/httpd/conf.d/ssl.confなのだが、
特に設定すべきことはこの三行だけ。

SSLCertificateFile /etc/pki/tls/certs/newcert.pem
SSLCertificateKeyFile /etc/pki/tls/certs/newkey2.pem
SSLCACertificateFile /etc/pki/CA/cacert.pem

これだけでOK、これでCA証明書を登録しておけば特に何も言われずにhttpsでアクセスできるはず。
CA証明書を登録したと言うことはその認証局を信用したということ、その認証局の信用した証明書は当然に信用する。
まぁこんな調子でDovecot・Postfixにも登録するかな。
そういえばPostfixの話だが、なんかうまくつながらんなぁと思ったら、こんな設定ミスがあった。
main.cfの中にだが

 inet_interfaces = localhost

これでは外部からの接続をすべてはねることになるから、ここにはallを入れないとだめだよと。
今まで気づかなかった。こんなのがあったんだな。

ところでHTMLにおいてIMGタグというと

<img src="logo.png" width="500" height="100" alt="Foo inc.">

という風に書く。XHTMLだと空要素ということで /を書かないといけないが。
必須な属性はsrcとaltだけ、他は一応不要。
ただし、width・heightは書くようにするのがいい。
なぜかというと画像のダウンロードを終わるまでうまく描画できないから。
手間はかかるけど書くのがいいですね。
ところでここではwidth="100"とダブルクオーテーションで囲んでて、特に何とも思わなかったが、
HTMLでは特に必要ないみたいだね。XMLでは必須、すなわちXHTMLでは必須なのだが。
なんかえらいしつこい書き方ですが、これで慣れているのは悪いことではないですね。
srcは言うまでもなく画像のありかを書くのだから、まぁたいした問題ではない。
問題はaltだ、これ、HTML 4.0より必須になったと。
altは多分alterativeの略、すなわち代替という意味だな。
だから画像の代替になるものを書けばよいわけだ。
この場合は、Foo inc.のロゴだから、その代わりにFoo inc.と表示されるとうれしいわけだ。
もし電線に止まったカラスの写真を貼ったならば、「電線に乗っかるカラスの図」など説明してくれるとうれしいのでそうすればいい。
もしも、スミスさんの紹介文中にスミスさんの肖像があったならばどうするかというと難しいな。
多分見えない人には全くうれしくないので、alt=""とするのも1つの答えだ。
もしくは、一応スミスさんの肖像がありますよと示すために、「スミスさんの肖像」と書くのも答え。
まぁどっちかというとalt=""の方が正しいかな。
alt属性の説明に声に出して理解できるかどうかとあるからな。
ただ、大きな画像にリンクを貼るときは、alt=""ではそのリンクにさわれないから、
「スミスさんの肖像」と書いておいてリンクを張ればいいかな。
箇条書きのために丸の画像を用意したら、それにはalt="*"と書けばいいかな。
もっとも、このような場合はスタイルシートで画像を定めるべきだと思うが。
枠線を画像で用意するなら、それはalt=""だろう。
ところで他方、title属性というのもあるらしい。
これはあまり知らなかったのだが、画像に表題をつけるらしい。
だからロゴの画像について、altには「例示合資会社」、titleには「例示合資会社のロゴマーク」と書くのがいいわけだ。
カラスの写真は、altもtitleも「電線に乗っかるカラスの図」かもしれない。
スミスさんの肖像について、altは""がよいと言ったが、もしtitleをつけるなら「スミスさんの肖像」と。
まぁとはいうけど、titleは図がある前提で見るものだからあまりおもしろくないかな。
Mozillaでは、ポインタを重ねると注釈として表示されるようにしていると。
まぁその程度のものだし、もちろん必須じゃないので、僕は書かない。
IEではaltでも同様の取り扱いをしてるが、特に意味はない。
ちなみにスタイルシートでtitle要素を表示させることはできる。
実はこれこそ:before、:afterの正しい使い方なんだけど。
特に使い道はないと思うけど。
まぁalt属性はいろいろ複雑なことが多いですね。
そういうことを考えるのにFirefoxのアドオンとして加えているWeb Developer Toolbarは役に立つ。
画像を無効化すると、きちんと理解できる。
Mozillaは画像がなければ代替文字を単に文字で表示する。だからそこに画像が来るべきだったと見えない。
あと、JavaScriptの無効化・CSSの無効化と、実感してみるのがいいな。
CSSの無効化なんてのは結構痛いな。
それでもある程度は理解できる箇条書きとかいうのはありがたいものです。
CSS・画像・フレーム・JavaScriptが使えないなんて無視できるほど少ないと言えるけど、
頭の片隅には置いておくべきですわな。
CSSがなくて上下ぐちゃぐちゃの文章とか、画像が表示できないから「ERROR!」と表示されたり、
JavaScriptが動かなくて画面が真っ白で意味がわからなかったり…
結構悲しいと思うよ。
ちなみにCSSで上下ぐちゃぐちゃは座標指定が原因で起きることがある。
IBMのホームページビルダーで座標指定で表示させるとこういうことが起きることがあるので注意。
座標指定で表示すること自体は悪くないけど、話の順番は間違えないように。
画像が表示できないからERROR!と表示されるのは困るな。lynxで見た人は全員エラーかよと。
まぁSPAM防止のために画像でe-Mailアドレスを書いたときは、さすがにalt属性で「(Sorry,image only…)」と謝ったが。
画面真っ白は、JavaScriptでいろいろ書き込んでいくのが前提になってるときおきうる。
Ajaxを扱ってやるときにありえることだな。きちんとnoscriptタグで指定しておこう。
Ajaxで有名なGmailでは、JavaScriptを切ると、JavaScriptをONにしろとかAjax不要バージョンの紹介とかが出てきた。
まぁ代案の説明があるし、Gmailの対応はいい方でしょう。
どれも悲しくなってくるので注意してくださいね。

ところで、こんな難題が出た。
HTMLにおいて、ボックスの角を丸めろと。
現在のCSS 2においては搭載されていないので、
画像を取り付けるか、1px幅の狭いブロックをたくさん並べるという悲惨な方法をとらなくてはいけない。
まぁ画像を取り付けることにしました。
で、これを:beforeと:afterの疑似要素を用いて、contentで指定すると。
いろいろ考えたのだが、HTMLは次のように書くことにした。

<div id="main">
  <div id="main_body">
    <h1>表題</h1>
    内容
  </div>
</div>

なんで二段重ねにしてあるのかというと、寸法の指定が難しくなるから。
main_bodyのところにはpaddingに適当な値を指定したいけど、mainのところに指定すると扱いが難しくなるので。
CSS部分はこの通り。

#main       {padding:0px; width:650px; margin:10px auto;}
#main:before{content:url("test/main_top.png");}
#main:after {content:url("test/main_bottom.png");}
#main_body  {padding:0px 10px; background-color:black; color:white;}

ところが問題が。なんか、上の画像とmain_bodyのボックスの間に隙間が空いてしまう。
調べると、H1のmarginが原因らしい。
marginは親ブロックの枠外にはみ出ることがあるらしい。条件はそのpadding・borderがそれぞれ0のとき。
すなわち適当にpadding:1px;などと指定すれば解決する。
なので、

#main_body  {padding:1px 10px; background-color:black; color:white;}

これでいい。
ただし、TransitionalでうまくいっただけでStrictではうまくいかない。
原因は改行コードのせい。
改行コードを空白と考えてその分のスペースを確保するとかなんとか。詳しいことは知らない。
とりあえずHTMLで使う分には問題ない。
しかし、おかしい。IE 8ではうまく表示されんぞ。IE 6・7でもだめだ。
一体どこのところがおかしいのだ。
:beforeと:afterでなく、直接imgタグを書き込めばできたが…
しかし難しい問題が多いな。
まぁこうなると、imgタグを使う方法にするべきだな。
というかさっきの:beforeと:afterの使い方はちょっとずれてるな。
HTMLを

<div id="main">
  <img src="test/main_top.png" alt="" height="50" width="650">
  <div id="main_body">
    <h1>表題</h1>
    内容
  </div>
  <img src="test/main_bottom.png" alt="" height="50" width="650">
</div>

CSSを

#main       {padding:0px; width:650px; margin:10px auto;}
#main_body  {padding:0px 10px; background-color:black; color:white;}

と定めればよい。まぁ割と素直なやり方ですね。
Strictではさらにimgタグ前後の改行コードの件で

img         {vertical-align:bottom}

を書き加えればよい。
これがもっともよい書き方かなと思うわ。
しかし、角を丸める機能、CSS3で実装されるのが楽しみだな。
結構使いたい人は多いのではないのでしょうか?
ちなみにMozillaは実験的に実装していて、SafariはCSS3の候補ということで先行的に実装してるとか。
ただ正式に使えるわけではないので今回は議論しないけど。
どうしても今は画像に頼ることになってしまうので。
なかなかうまくいかないものです。

さて、CentOS入れるよ。
というわけで、マシンを組み立ててやってました。
さて、ところでLinuxのパーティションというと、
/bootと/にそれぞれマウントするパーティションと・SWAPのパーティションを用意するのが普通。
特にさらに/homeや/varを設けることがありますが、まぁ今回は特に考えなくていい。
ところがRedHat系のディストリビューションではいつのまにかLVMで割ることが普通になってた。
LVM言うのは小さなブロックをたくさん作って、これをいくつか集めてパーティションとする方法。
物理的に違うディスクでも、これを用いると1つのパーティションとして扱えたり、
設定を書き換えることで動的にパーティションサイズを変えられたり、フレキシブルに対応できると。
ところが見通しがあまりよくないと感じたので、あえて古典的にパーティションを割ることにした。
こんな具合
/boot　　100MBのext3
/　　　　　SWAP分残して全部をext3
swap　　　メモリの容量の2倍 今回は1GBの2倍の2048MB
という具合。
さて、これにインストール。結局CDは6枚のうち4枚しか必要でなかった。
途中、アメリカの某社とうちは関係ないと言っておられた。確かに組織的にはCentOSは独立してますけどね。
それで起動させてみると、いい感じにGNOMEが立ち上がって動く。
うん快適。でも別にX Window Systemはいらないよ。
というわけで調べてみると、/etc/inittabをいじればいいと

id:3:initdefault:

ここの3のところが起動時のランレベルだから、5ならXで起動、3ならCUIモードで起動。
もちろん3で立ち上げても必要なときにはstartxを叩けばXは立ち上がる。
さて、ネットワークの設定ですが、netconfigでやる印象が強かったのだが、そんなものはない。
で、どうしたものかと思ったが、よく考えると、setupという便利なもんがあるんですよ。
setupはいろんなものの設定ができるツール。
これでやるんだった。Vineにもあったけど、あんまり印象なくて。
実に快適に設定できた。
さて、ところでセキュリティーについての設定だが、
とりあえずはファイヤーウォールはOFFにしておきました。
後にきちんとiptablesで定義するから。もちろん現在は脅威が及ばないように隔離してありますよ。
で、SELinuxなのだが、これについてはあきらめることにした。
非常に設定が難しい。しかし、それに見合うかというとね。
とりあえずしょぼい防御法ですが、動かすサービスを減らしたり、ポートを閉じたりして、脅威が絶対に及ばないようにしたり、
可能な限り頑丈にして隙を見せないようにして、それでできる隙はあきらめると。
わざわざVineからCentOSに移動した理由というのは、可能な限り頑丈にする一環。
CentOSの目標として、RedHatのソースの更新から72時間以内にRPMを提供することというのがある。
実際はもっと速いと言っておられるが。
Vine Projectは明らかな人手不足なんですよ。なのでこうはいきません。
そもそもVineは優良な日本語環境を整えるのが目標であって、そういう意味ではこれ以上のものはないね。
CentOSというかRHELも結構繊細な方だけど、Vineには絶対に勝てない。彼らはCUIでもほとんど日本語化している。
Vineは日本人が身近にさわって使うのにはとてもいい。デスクトップとか学習用のマシンにいいと思う。
けど頑丈であることを要するところではある程度強いCentOSを使うことにしたということです。
CentOSなんて変なのを選んだのは、どうしてもRedHat系ディストリビューションから離れられなかったから、なんというか…
話は戻って、SELinuxはこの隙を埋めたり、減らしたりするものなのだけど、なかなか…
まぁとはいいますけど、将来的にはここにも手を出したいと思うけどね。
これからの課題はそれじゃないかなと思うよ。
さて、あとサービスをいくらか充実させたりしていかないとなと思ったのだが、
意外とそろっていて驚いた。
Apacheのバージョンが2.2だったのには本当に驚いた。未だに2.0使ってたんだけどね。
ただ、postfixじゃなくてsendmailだったので、これをとりあえず置換してみました。
yumでpostfixを入れて

# alternatives --config mta

で設定すればOK。
あとはサービスを下げて上げて、chkconfigで起動を変えて完了。
これからpostfixの設定をすることにしましょう。
さて、chkconfigの整理をするか。

今日は弟が自転車のタイヤをパンクさせてきた。
まぁ応急処置だけなら彼もできるのだが、ちょっと問題があった。
ゴムのりが消えてる。まぁ使い切ってしまったんでしょう。
ゴムのり言うのはちょっと変な接着剤で、塗って乾かしてから使う。
それでそこに貼り付けたいパッチの上からたたきつける。
圧力でくっつく接着剤と言えるかな。
パンクの応急処置の要なんだけどね。
ホームセンターに行けば売ってるだろうよというわけで、
弟は自転車がパンクして動かないので僕が買いに行くことに。
そんなわけで自転車ですいすい走ってたよ。えらい後ろから車に抜かされたが。
あの道路で車と張り合おうとしたのが間違いだな。まぁそれでも快適に走れたからいいよ。
帰り道道中で一服することになってしまったが。
で、ゴムのりだが、小さいペンキみたいな感じでカンに入って売ってた。298円なり。
これで帰宅して続きをすることに。
ほどなく修理完了。それでチューブをタイヤに戻すのに手間取ったけど戻って、とりあえず動くよと。
ところでしつこく応急処置と言ったが、本当の処置はチューブの交換。
けどすごい手間だからやってられない。タイヤ外さないといけないのよねー。
マウンテンバイクなら簡単だと言うかも知れんが、まぁママチャリに期待しちゃいけないよね。
そんなわけで応急処置で終わりになってしまう。
ただ、チューブとパッチが一体になるので、応急処置言う割には強いとは思うけど。
まぁさすがに応急処置言うだけあって作業は至極簡単ですけどね。
何度もクギやら段差を踏んでパンクさせたが、その晩のうちに完了してる。
けっこう便利なもんですよ。道具さえあればプロの手は多分いらない。
Do it yourselfねぇ。いいもんですよ。

なんか知らんのだが、こんなものを見つけた。
スーパー堤防なるものだが。まぁ実感は沸かんな。
なんせ川の上流にはあまり堤防がないからな。あっても低すぎる。
当然淀川の下流の話ですね。大和川もらしいが。
どういうものかというと、高い堤防の川側、陸側に土を盛ると。
まぁ川側はまぁよいとして、陸側は高さの30倍の範囲になだらかな坂になるように土を盛ると。
さすがにこれだけの土地は惜しいのでその陸側は割と自由に使えると。
よいところは、底が広いので水に流されにくいと。なるほど。
あと、地盤の強化も同時にするから地震でも壊れにくいと。そりゃ補強すればねえ。
川の部分だけ溝で残るような形になるということで、それにもメリットがあって。
堤防が壊れない代わり、堤防の高さより高いところまで水が来るとそのなだらかのところに水が入ってくる。
とはいっても、普通はそこまでくると堤防は壊れてるから、それよりは随分いいと。
どうも堤防が壊れる理由は水が堤防を構成する土に入るかららしいので、
堤防の補強では非透水性の土でもって川側に土を盛るのもメニューに入ってる。
ところが、それはもはや堤防じゃないだろうと。それにそんな広い土地どうやって用意するんだ。
まぁ確かにそうだ。
公園になってればなんとかなるかも知れんが、家ばっかりだったらどうする。
というわけで区画整理と一緒にやってしまう場合が多いらしいね。
ますます堤防作りとは思えないな。
なるほどね、確かに治水の名で再開発してると言われるわけだ。
まぁあまりにリッチすぎるのは確かだな。
あと、本当に効果が発揮されるのは下流の広い範囲にスーパー堤防ができてから。
それまでは効果も薄れてしまう。
しかもこれが本当に役に立つのは非常にまれな例なので、まぁ特に気にすることないと。
えらい楽観的な見方だがまぁ間違えではないだろうな。
しかしダムといい、水の相手にはでかいものの効果が絶大だな。
まぁダムについては水道の供給のための枠があったりで、おかげで高品質な水道が使えるというのもあって、
たまに洪水調整で役立てばいいかぐらいにしか思わないけどね。

あの変な切符で今日は出かけてきたわけですが、
まぁなんや言っても、行ったのは日本橋ですからね。
で、部の用事でいろいろ探し回ってました。
まず、今回必要なものは、
Sempron(AM2)または安価なAthlon 64(AM2)、AM2の安価で扱いのよいグラフィックがオンボードのマザーボード
まずこれですね。
なかなかSempronって売ってないんですね。売ってれば安いですよ。
実際今回、4500円ぐらいだったはず。
ところが、Sempronはデスクトップ用としてはほとんど人気がない。
というのも、Athlon 64が結構安価で手に入るから。6000円ほどであったはず。
まぁ基本的には似てるんだけど、Sempronはキャッシュをケチってるものなのですよね。
その代わり安いと。ところがAthlon 64でも安いので特に選ぶ理由に乏しいと。
昔は低消費電力というメリットもあったが、Athlon 64でも最近はTDP45Wを達成してる。
まぁとはいうけど、1円でも安く動くものをとなるとSempronかなと。
で、もう1つ、マザーボードだが、これが結構難儀でいろいろ探し回ったものだ。
というのもこのマシンで動かすのはCentOSだからある程度期待できるチップセットを選ぶ必要がある。
まぁNVIDIAかなと思ったけど。
で、いろいろやってたのだが、結論から言うと、MSIのK9N6SGM-Vになった。
Nの字からわかるとおり、NVIDIAのチップセットを乗せている。
気になって調べたのだが、MCP61SというチップセットはNVIDIAの統合型チップセットみたい。
どうも根底にはGeForceがあるそうなので、何かとドライバーには困らなさそう。
それなりに古いものではあるが、特に問題ではないと思う。
あとは、電源とLANカード、これはPCIのを選んだ、
あとHDDを玉突きで得ることにしたので、十分容量の大きいHDDを買った。SATAだよ。
実は玉突きで得るのもSATA。まぁLinuxはSATAの対応もそれなりに早かったからね。心配はしてないけど。
あと、ケース。まぁ予備的な意味もある。
ほとんど一台PCを作れるな。まぁ今回は改造というよりも新造と言った方が正しい気がする。
なんせ前のがDuronなんで…
さて、あといろいろ見てたのだが、ご機嫌ななめのDVD±RW DLドライブの代わりを探してたら、
SATAのやつと、PATAのやつ、どちらも安くで売ってた。
いろいろ考えたのだが、結局PATAの方を選んだ。
確かにポート数から考えればSATAの方が有利で、実際PATAのポート数不足で一台のドライブが使えていない。
まぁ使えなくてもかまわないのだけどね。
とはいってもSATAでは使える機械が限られる上、ブート周りに不安があったので、
ここはまだまだ使えるPATAを選んだ。まぁPATAはDVD関係ではまだ残るでしょうし。
さて、家に帰ってきてつないでみた。ちなみにASUS。
neroが付いてきた、新しいバージョンなのでアップデートしておいた。
さて、これでCentOS焼くよ。
CentOS 5.1はDVD1枚またはCD6枚なのですが、
これもいろいろ考えたのだが、CDでやることにした。
正直手間もかかるし読み込み速度もCDは遅いし、あまりよくないのだが、
いろんなマシンがありますからね。その中にはノートPCでドライブの入れ替えが不可、外付けドライブからのブートも不可。
そうなるとやる方法がない。そのあたりも考えてCDでやることにした。
もっともデスクトップの場合はDVDドライブを借りてつければよいのであまり気にすることではない。
さて、今日はそんなところ。
それにしてもVISAデビット便利やわ。今回昼飯代以外は全部これ。
おかげで少ない所持金を食わずすることが出来た。

IE 8についての今までの記述に何かと間違えがあった。
どうもデフォルトで標準準拠になってるみたい。なので特に注意する必要はない。
ただ実際のリリース時どうなるか知らんけど。
だから、X-UA-Compatibleは主に旧IEの動作を再現する必要があるときに専ら使われるでしょう。
確かにAcid2には合格してそうだな。
さて、昨日の問題、いろいろ考えてたのだが原因がわかった。
ただ実のところIE 8の動作には疑問がある。

<div style="position:absolute; top:0px; left:0px; bottom:0px; width:100px; padding:50px; margin:0px;
    border:solid 0px black; background-color:yellow; color:black; overflow:auto;" id="a">
  1<br>2<br>3<br>4<br>5<br>6<br>7<br>8<br>9<br>10
</div>

まず、確認だが、
これを描画すると左に200pxの黄色い帯が出てくる。これはIEでも確認できた。
padding分が50px×2、内容部分がwidthで指定した100px、合計200px。
で、字があふれ出るときは適当な動作をする。
字があふれるときだけスクロールバーが出てくるのが普通で、Firefox・Opera・IE、全部この動作。
スクロールバーはブロックの大きさを変えることなく出てくる。
padding部分を食う感じで出てくるな。
さて、問題はここから。
この表記に従えば、上と下と左は端にぴったり合うはず。
position:absoluteは絶対座標指定。親ブロックの端からなんぼか決めてやる。
どうも調べたのだが、この寸法の基準はborderの端みたい。
もっとも今回はmargin・borderの大きさはないので特に気にすることはないが。
だからここでmargin:50pxぐらいに指定しても上と下と左の設定は特に生きてこない。
そうなると上と下と左の端から黄色い帯は始まらないとおかしい。
事実FirefoxとOperaはそうだ。
ところがIE 8はどうもおかしい。なんか端がずれてる。
でいろいろテストしたのだが、どうも
overflowがautoかscroll、すなわちスクロールバーが関係があるとき、
paddingの値が0pxでないとき、この2つが重なったとき、
positionをabsolute・fixedに指定して、top・bottom・left・rightを用いて寸法を指定したとき。
おかしいことが起きる。どう考えてもバグなのだが…
しかし、なんでこんなことが起きるんだろ。
というのも、こうやって書くと非常に限定的なパターンに見えるけど、
疑似フレームでよく指定することではあるわな。
まぁこちらに問題があるのかもしれないけど、どう解釈してもこれはおかしい。
bodyのpaddingの値が適当に設定されてるのかと思って確認したが、
特にそんなことはなくて0px。どうしたものかね。
ところで、この疑似フレームは僕が設計したのだが、
世間で一般に使われているものと比べると、position:absoluteになってるのが大きく違う。
特に考えてなかったのだが、普通はfixedを使うみたいだね。
とはいうけど、親ブロックたるbodyは画面いっぱいだし、
画面をスクロールすることは考えなくてよいと考えたので、absoluteにしてた。
これのよかったことはIEでもそれなりの形になってたこと。IE 6はfixedに対応してなかったもので。
まぁあとは随分不器用だなという話。素直に書きすぎてIEでの表示がおかしくなりやすい。
普通は器用にブラウザ別のバグを突いて動作を決めてやることが多いけど、
これについてはIE 7で改善されたからあまり気にしてなかったが、
この件に関してはIE 8で悪化した。どうしたものか。
そう、だから実は

<meta http-equiv="X-UA-Compatible" content="IE=7">

をhead内に書けば解決したりする。なんでやねん。
だから悩んだんだよね。一体誰が正しいことを言ってるのか、
結論から言えば、多数決でIE 8が間違ってると考えた。筋が通ってないというのもある。
まぁそれにこれが正しかったにしても、解決法が見あたらん。
だから直せない。そりゃ正しい書き方だろうしね。
まぁ、この問題点をMicrosoftが拾って改善してくれることを期待するかな。
暇なら、これについてMicrosoftに報告するかもしれん。

今は回線の障害で外につながらん。逆に外からもつながらん。
そういう意味では心配をかけることですね。
それにしては長時間だな。どうしたものか。
ところで、IE 8試してみた。
なんかインストールしたらIE 7を置換されてしもた。
ところで、IE 8、試してみたら、なんかおかしい。
いや、まぁ自分のページは問題なかったのだが、別のところで、絶対座標指定でブロックを配置してるのがあって、
これがおかしい。
ただ、多分正しい動作をしているので、何があかんのか検証中。
わからん。
外から、ブロックはmargin部分・border部分・padding部分・内容になってて、
padding部分・内容は箱の内側、background-color:yellow;にすれば黄色になる。
それで、寸法の基準になるのはpadding部分の端のはずなんだよね。
でいろいろ疑ってテストしてみたのだが、正しく動作している。なんでだろ。
あと、相変わらず、application/xhtml+xmlには非対応。
これでいいのか、IE 8、何か思うところがあるのだろうか?
まぁまだXHTMLを使う予定はないけどな。
それにしてもIE 8はどういう風に受け入れられるのだろうか、
未来のことはわかりませんけどね。

今の時代に手書きの切符とは似合わん気がするが、
電車の中で車掌がカリカリ書いていた。専用用紙とペンだけだから扱いがよいのだろう。
さて、Internet Explorer 8の開発は順調に進んでいるようです。
IE 7の登場から間もない気もしますが、IE 7もBETA版について言えば随分前から配布してましたし。
ところでもうすぐMozilla Firefox 3もリリースされるでしょうね。BETA 4まで進んでいて、今度BETA 5を出すとか。
さて、両方とも目玉は、CSSの標準の1つの試験法であるAcid2をきちんと表示できたということ。
Acid2は一つの例に過ぎませんが、非常によい評価法であると思います。
きちんと指定通りならスマイリーが表示されるという、なんとも言えないものですが、
スマイリーにどれだけ近いかというのを評価するもの。
標準準拠ということを考える上でよいテストであるのは確か。
これをFirefox 2で見ると、ちょっと崩れてしまってる。
ところがIE 7などは悲惨。血に染まってる。
それでFirefox 3のBETA 4を拾ってきて試してみると、確かに崩れない。
ところが詳しいことを言うと、鼻の位置がサンプルを数px違う。
ただ合格しているらしいOperaも鼻はおかしいので、まぁもしかするとサンプルに問題があるのかも。
とりあえずここまで完成度が高ければあまり疑問に思うことはないような気はします。
しかし、Firefox 3だが、随分感じが変わったな。まぁ特に疑問に思うところはないけど。
BETAの間は封印することとしよう。
あとIE 8は拾ってきたけどまだ試してない。今度記事にするかも。
どうも、METAタグでモード指定することで標準準拠か旧IE互換かそのあたり選べるとか。
HTTPレスポンスヘッダーでも同じ事らしい。

<meta http-equiv="X-UA-Compatible" content="IE=8">

Xから始まるのは、未登録ということだろう。これでIEで言えばVer.8に従って描画せよと。
それと、最新の技術で描画せよという意味でIE=edgeとセットすると。
これがよいかもしれない。X-UA-Compatibleの思想にはあわないけど。
ところでIE専用なのに何でIE=xxという書き方をするかというと、もしかすると他のブラウザも使うかもしれないから。
Fx=3とか、Opera=9とか、そういうことをするかもしれないと。しかしそれはないだろと思いますけどね。
よいか悪いかは別として、IE 8では予想通りの表示ができる可能性があると。
それだけでも進歩でしょう。
ただ、当然と言うべきかX-UA-Compatibleを使うことにはちょっと評判が悪いけどね。
ところで、emという単位。最近よく使うのだけど。
これが予想より難儀な単位だ。
たとえば、

<div style="font-size:0.5em;" id="a">
  <div style="font-size:0.5em;" id="b">
    文字列
  </div>
</div>

これを素直に解釈すると米粒みたいな文字になる。
たとえば標準のフォントサイズが16pxであったとき、idがaのdivブロックの中は8pxが標準に設定される。
idがbのdivブロックの中は親ブロックの標準の大きさの0.5倍、だから4pxに設定される。
なるほど…そう考えると扱いに悩む単位だ。
そこで、いろいろ考えたのだが、bodyを0.8emに設定する。
そしてこれと比べて値を決めると。
だからこれの1.8倍・1.4倍・0.7倍と。それでよさそう。
emを使う意味というのは好き勝手に標準のフォントサイズを変えると、字の大きさが変わると。
すなわちそれでも崩れないことが重要なので、emの単位で高さを指定するブロックもありますよ。