読者です 読者をやめる 読者になる 読者になる

PREタグにスクロールバーを付けたい

前から、はてな記法のpre記法で書いた内容が長いと、画面からはみ出てしまって困っていた。「はてな "スクロールバー" 表示されない」でググってみると同じ悩みを持つ人を発見。はてなのスタイルシートに以下を追加すればスクロールバーが表示されるようになる。

/*(追記 by:BigFatCat) */
/* overflow-xとoverflow-yはCSS2の仕様には含まれていないらしい */ 
pre {
  overflow-x: auto;
}

/* CSS2の仕様では以下のように書く */
/* 値autoを設定すると、ブラウザに依存するが、一般的にはスクロールできるようになるらしい */
pre {
  overflow: auto;
}


うーん、確かに、スクロールバーが表示されているブログのCSSを「Firebug」(Firefox拡張機能)で確認すると、上のような記述がある。自分ももっとよく確認するようにしたほうが良いな…。

参考

鰯のテクニカルノート: PRE タグにスクロールバーを付けた(情報源)
詳解HTML & XHTML & CSS辞典(情報源が正しいか、確認するために使った)