MADCONNECTION

窓からBlogを見る

MacOSX10.3とSafariを使っているのでWindowsからこのBlogの見え方を気にしたことがなかった。MovableTypeもWindows優先で開発されているのだろうから、MacOSで正しくレイアウトされていれば、Windowsでは問題ないと思い込んでいた。それが、昨日になってAKiさんからMacで作ったBlogはテキストがフレームの横幅に合わせて自動改行されずに、横にだら〜っとだらしなく広がって正しくレイアウトされていないとの指摘を受けた。そんな訳でデータの検証とスクリーンを撮るくらいにしか使ってないWindowsPCをPowerMacG4(MacOSX+AirMac)のインターネット共有に繋いでからMyBlogにアクセスしてレイアウトを検証しながら直しました。

左がMacOSX10.3+Safari、右がWindowsXP+IEの画面。クリックで拡大。
Windowsから当Blogにアクセスして下さっていた方々、今まで見苦しくてご迷惑お掛けしました。

MovableTypeのStylesheetを変更、bodyと#contentにピクセル単位で幅指定、いちおう横幅832ピクセルのモニタを想定して、[body]に[width:800px;]を追加、[#links]のディフォルト値が[width:200px;]なので、適当にマージン分等も差し引いて[#content]に[width:560px;]を追加しました。

body {
margin:0px 0px 20px 0px;
background:#EEEEEE;
width:800px;
}

#content {
position:absolute;
background:#FFF;
margin-right:20px;
margin-left:225px;
margin-bottom:20px;
border:1px solid #FFF;
width:560px; }

これで一応、WindowsXPでもレイアウトが崩れないで見られるようになりました。何かもっと良い方法がありましたらご教授下さい。しかし、こんな基本的な事をBlog入門書で触れてないとは、親切じゃないよね。近々出版されるらしい入門書には書いてあるのかな。
Posted by S.Igarashi at November 7, 2003 11:43 PM | トラックバック