prosseek: Syntax highlighter issue with google chrome

Saturday, October 27, 2012

The code with SyntaxHighlighter shows wrong line formatting in google chrome. Screen Shot 2012 10 27 at 10 10 36 AM

I found that this is a known issue with of line formatting, check this site.

The http://alexgorbatchev.com/pub/sh/current/styles/shCore.css source has the line that causes this problem.
Screen Shot 2012 10 27 at 10 16 49 AM

There are easy two solutions.

Solution 1

Modify the shCore.css : replace this line.

.syntaxhighlighter table td.gutter .line {
  text-align: right !important;
  padding: 0 0.5em 0 1em !important; <-- Replace this line
}

.syntaxhighlighter table td.gutter .line {
  text-align: right !important;
  padding: 0 5px  !important;
}

Or make it point to where the bug is fixed. : http://codeoncloud.co.cc/shCore.css

Add following line after Configure HTML/JavaScript edit. Screen Shot 2012 10 27 at 10 19 03 AM

Following code should be added.

UnknownMay 11, 2014 at 11:28 PM
This explains the concept really well and thanks for sharing. hope this will also help u to make it more effective:
http://stackoverflow.com/questions/11804789/extra-lines-using-syntaxhighlighter-for-chrome-only/23602138#23602138
ReplyDelete
Replies