SyntaxHighlighter を Google Chrome で使ったときに垂直スクロールバーが表示される問題

Pocket

Gooogle Chrome でシンタックスハイライトされたところで横に垂直スクロールバーが必要もないのに表示される問題。
SyntaxHighlighter 3.0.83 で検証しました。

神経質な人は気になって仕方が無いのではないでしょうか。
私も WordPress で SyntaxHighlighter Evolved プラグインを使っていてずっと気になっていました。
11ヶ月も前に提起されている問題なのですが、本家は修正する気もないみたいです。

私の場合 styles/shCoreDefault.css を以下のコードを末尾に挿入したら直りました。
SyntaxHighlighter Evolved プラグインを使っている場合は wp-content/plugins/syntaxhighlighter/syntaxhighlighter3/styles/shCore.css を修正してください。

.syntaxhighlighter {
  overflow-y: hidden !important;
  padding: 1px !important;
}

参考

alexg / SyntaxHighlighter / issues / #177 – Superfluous Vertical Scrollbars in Chrome/WebKit — Bitbucket

投稿者紹介

株式会社ユニキャスト
私たちは、テクノロジに魅せられた個性あふれるメンバーによって構成された茨城県日立市に本社を構えるベンチャー企業です。
”テクノロジを通して「驚き」と「感動」を創造し、人々の「夢」と「笑顔」を支えます。” の経営理念をモットーに明るい未来を描き、ワクワクする企画提案を続けて参ります。

1件のコメント

  1. Chromeユーザーなので助かります!
    私も無事に縦スクロールバーが消えました。ありがとうございます。

    もしよければ折り畳みではなく、本当に縦スクールできるようにする方法を考えていただけませんか?長いソースを張るときにheight = “300”みたい設定して張れたらできたら便利です。

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください