ext PRESTALEのh1要素の背景が妙にしっくりくるなぁと思ったら、高さが40pxだからだと分かりました。あれあれ、日本ではお馴染みの200 * 40pxのバナーサイズ。国際標準ではないけれども。
このサイトもそうだけど、私の環境(解像度1024 * 768px / Firefox)で文字サイズを2段階大きくすると表示が崩れます。ext PRESTALEの場合は背景と文字が合わなくなるだけだからまだ良いけど、こっちは右側のカラム(div class="info")が落ちる & 800 * 600pxの環境では最初から落ちてるから目も当てられない。幸い解像度が800 * 600px以下の閲覧者は640 * 480pxの0.32%(2008/01/01～2008/02/07)しかいないけど、そういう問題でもないよね。でも仕方ないから800 * 600px以下の人はさよならマーチ。めんご。
画像とかCGに詳しいと思われる(それ系の授業を教えているため)教授に、文字サイズを大きくしたら、(例えばアイコンなどの画像をリンクにしてるケースが考えられるため)それに合わせて画像を大きくすることはできないかと聞いてみたら、現状無理だそうです。むぅ…。
このサイトのp要素は、:first-letter擬似要素で左に1em分マージンを取ってるんだけど、その要素内にa要素を入れると、下線(この場合はtext-decoration？)と:hover擬似クラスがマージンを取らないのはFxのバグ？
こんな方法があったとは！環境によっては1emが16pxでないこともあるだろうけど、やむにまれず:1emが何pxなのか自動的に計算する方法(3)みたいな感じで計算して、どんな環境でも1emが16pxになるように指定すればいい感じになると思いました。
if(User's 1em scale < 16px) {
User's 1em scale + (16px - User's 1em scale);
}
else if(User's 1em scale > 16px) {
User's 1em scale - (User's 1em scale - 16px);
}みたいな感じの計算で。別に16pxである必要はないですけど。なんか強制してる感じがするけど、絶対指定するよりかはまだマシかなぁと思ったりもします。いやはや、世界は広いなぁ。気づかせてくれたmoja8さん(2008年2月8日のブックマーク)に感謝です。
お前何回追記してんだよ！みたいな？ｗ
この場合だと、:first-letterよりtext-indentの方がスマートな気が。
対象がfirst-letterなので、このページでは(a要素の左側ではなく)"e"という文字の左側にマージンが取られる、ということでは。
p:first-letter(p要素の最初の文字に何々)だから、じゃあp要素の最初の文字の左側は一文字分スペース空けれ！っていう感覚で使ってました。もう何の疑いもありませんでした。
と言うわけで、text-indent : 1.0em;に変更しました。
フロートで段組するときって、両方left、もしくは両方rightが一般的だと思ってたけど、違うのかな。
これも、div.articleで左に回り込むように指定したんだから、次にくるdiv.infoは右に回りこむように指定するもんだという感覚でした(もともとデフォルトで左詰に表示されるので)。div.articleの指定だけで見事に右側に回り込んでくれました。ここまでしてくれるんですね彼ら(誰)は。
どちらが一般的かは分からないですけど、この方法で行こうと思います。ちょっと表示がおかしいので後で弄ることになりますけど。これからバイトなので；
いろいろ言及していただいて、こんなに早く問題解決できました。どうもありがとうございました！
