overflow:autoにしているのに横スクロールバーが表示されない

公開日: 

FC2のレイアウトをいじっているときのお話。
ソースコードを示すときに、引用の為に私は、blockquoteを使っているのだが、
ソースが横に長すぎてはみでてしまい見栄えが悪かった。
そこでCSSをいじってoverflow:autoをつけたのに、横スクロールバーが表示されない!
解決方法を探すのにちょっと時間かかったのでメモメモ。

sponcer link


引用に枠線/背景色/横スクロールバーを付ける
最初はここを参考にしてやってみたのだが、冒頭でも話した通り、overflow:autoじゃいけんのですよねー
overflowの属性をautoにする以外にも、scrollと指定したのにスクロールバーは表示されんかった。
そんで結論として、
[CSS] overflow:auto で横スクロールバーがあるときに高さが足りなくなるのを防ぐ
ここを参考にしたらあっけなくできた。
どこのページみてもスクロールバーを表示させるには、overflow:autoって書いとけば良いしかかいてないんだけど、
それだけではダメみたい。
解決方法として、

overflow-x:auto;
overflow-y:hidden;

これを指定してやったら横スクロールバーがでてきた!

これで横に長い引用でもらくらく対応だ!!!!!!!!!!!!ひゃっほおおおおおおおい!!

現場のプロから学ぶXHTML+CSS

  • このエントリーをはてなブックマークに追加
  • Pocket

関連記事-こちらもどうぞ

  • 記事はありませんでした
PAGE TOP ↑