テーマ・スタイルシートについて

はてな

テーマについて

id:Paulさんから02/15のコメントで質問をいただいていますのでこちらでお答えいたします．

「はてな」のテーマEarth-brownについて質問があります。(中略)引用ブロックや整形済みテキストの中の文が長文のとき画面の設定を変える（例えば、お気に入りを開いたり、文字表示を大にしたりする）と、レイアウトが崩れてしまいます。引用ブロック、整形済みテキスト内の文だけは、画面に合わせて改行しません。

まず，整形済みテキストについてですが，HTML 4.01 Specificationの9.3.4 Preformatted text: The PRE elementによるとMay disable automatic word wrap.つまり，ブラウザはPRE要素内では自動的に改行する必要がなく，多くのブラウザでは改行しないようになっています．また，整形済みのテキストを表示するという目的においては自動的に改行しないことが望まれる挙動だと思います．
解決方法として，整形済みのテキストを崩すことなくcontentの幅からあふれた分を自動的にスクロールバーを表示するoverflowプロパティを指定することをおすすめします．具体的には次のようになります．

pre {
 overflow: auto;
}

PRE要素の意味を考えるとあまりおすすめできませんが空白などの処理を指定するwhite-spaceプロパティを用いて改行や連続するスペースなどを一つスペースに変換し内容をボックスの大きさに合わせて自動的に改行することもできます．

pre {
 white-space: normal;
}

次に，引用ブロックについてですが，具体的なブラウザや環境が示されていないので同じ状態を再現することができませんでした．手元のMozilla1.6およびIE6.0で引用ブロックに長い文章を入れて試してみましたが表示が乱れるということはありませんでした．
CSSに関しては以下のサイトに詳しくありますのでそちらをご覧になってください．

このページの現在のスタイルについて

現在このページは，Scientist紺野 化学ばーじょんですが，BBSでMac IE5 でスタイルシートが適応されないという質問をいただきました．
大変申し訳ないのですが，今のところ身近に使用できるMacが無いので Mac IE については表示の乱れなどを防ぐためにスタイルシートをOFFにしています．今後，Macを使える環境になったら直していきたいと思います．
Netscape4.xについてもCSS関連が正しく解釈されないことが多いためスタイルシートをOFFにしています．