highlight.jsのソースコードを改行させないCSS

このブログは、hightlight.jsを使ってソースコードのハイライト表示をしているけど、デフォルトだと横幅を超えると改行されるようになっていて、これを改行させずにスクロールして表示するようにしたいなぁと思ってた。そんな時の CSS。

pre {
  overflow: auto;
  word-wrap: normal;
  white-space: pre;
}

これでスクロールしてソースコード表示出来るように。 ただ iOS だとスクロールに引っ掛かりがあるので、さらに -webkit-overflow-scrolling: touch; を入れてスムーズにスクロールするようにした。