0

I am using Jekyll and trying to display some code in a post, but I can't figure out why the code wont display on different lines. From what I understand it's supposed to word wrap with the way I have it set up.

I have this in my config file:

markdown: kramdown
highlighter: rouge
kramdown:
  input: GFM

My code is:

{% highlight javascript linenos %}
var text = prompt("Write your text.");
alert("You have written " + text.length + " characters, you have " + (140 - text.length) + " characters remaining.");
{% endhighlight %}

It displays like:

Jekyll syntax

Also on mobile it just removes all of the styling and displays like a regular <code> tag.

You can view the page here: https://alignthem.com/07/03/2022/javascript-length-and-concatenate/

dsamardjiev
  • 400
  • 1
  • 11
  • 32

1 Answers1

1

Adding:

white-space: pre-wrap;

to .highlight pre worked

dsamardjiev
  • 400
  • 1
  • 11
  • 32
  • This answer also talks about this. Main change is to to be done in *_sass/_base.scss* file. https://stackoverflow.com/a/28015546/2650427 – TrigonaMinima Jul 08 '23 at 08:16