I created my website using Jekyll, using Beatiful-Jekyll theme to be precise. For the syntax highlighting I used Rouge. When I don't show line numbers everything work great. When I show line numbers, sometimes the line numbers do not start from the first line of code (same at the end, they stop some lines before the end). And sometimes they are aligned with the code, sometimes not.
Here is an example where everything works fine:
Here is an example where line numbers are aligned with line codes but first and last line numbers are missing (in another example, the first three and last three are missing).
And the last example, is where line numbers are not aligned with line codes:
I believe that the problem comes from linenos. To show line numbers I use
{% highlight <language> linenos %}
<code>
{% endhighlight %}
Because I tried the following configuration in the _config.yml file:
kramdown:
input: GFM
syntax_highlighter: rouge
syntax_highlighter_opts:
css_class: 'highlight'
span:
line_numbers: false
block:
line_numbers: true
start_line: 1
And in this case, line numbers shown by default are shown correctly, but line numbers shown using {% highlight linenos %} are still bad.
default_line_numbering_without_linenos
Thanks in advance
I had the same Problem with the lines not being aligned. For me the fault was actually the font-family.
Somehow the code used
font-family: 'Open Sans', sans-serif;
while the line numbers usedfont-family: monospace, monospace;
I had to add this in a style file: