Extra Lines using SyntaxHighlighter for Chrome Only?

Question

Extra lines are being inserted when I am using Chrome to look at a draft blog post (on blogger) that uses syntax highlighter e.g.

Answer 1

There is no need to reference a different CSS file. Paste the following style block after the link tag that references shCore.css:

.syntaxhighlighter table td.gutter .line adds 5 pixels of horizontal padding around each line number.

.syntaxhighlighter table td.code .line removes all padding from the line of code itself.

.syntaxhighlighter .gutter adds 1 em of padding between the gutter and the line of code.

.syntaxhighlighter table solves an overflow problem I was seeing with Chrome. For code blocks that overflowed horizontally, Chrome was rendering a vertical scrollbar that could be scrolled 1 pixel. Adding 1 pixel of padding to the table inside the container div fixed it.