2008-09-05

@ Pre 要素に横スクロール・バーを付けた

当方のブログ、今まで pre 要素で横に長〜いテキストを書くと右端がサイドバーに隠れて見えなくっていた。例えば、ソース・コードをそのままコピペした時とか、長いワンライナーを書いた時にそんなことが起きていた。

今日、改善策を入れた。

CSS で一行だけ。

div.quote, pre.sample {
  margin: 0 0 1em 20px;
  padding: 5px 0 5px 10px;
  overflow: auto;
}

overflow というのがそれ。行をはみ出す (overflow する) 時に、自動で横スクロール・バーを出してくれる。

これで、少しはブログを見易くなったんじゃないかと思う。今まで、ご不便かけててごめんなさい。

4 comments:

rok said...

これいいですね。

機会があったら使ってみます。

@aka said...

どぞ、お使い下さい。

たった一行なんですけど、いざ必要な時に思い出せなくなるんですよね :p

Chuta said...

参考にさせて頂きました。有難うございます。
# でも自分はまだ長いコードを載せていないので
# 成功しているか確認できていないですが。

@aka said...

chuta さん、はじめまして。記事が参考になったようで、良かったです。

長いコードがブログにのるようになるといいですね :)

Post a Comment