highlight.js inline mode possible?

Question

I was able to make a code-block with highlight.js like this:

<pre>
  <code class="haskell">
    {-# OPTIONS_GHC -Wall #-}
    euclid :: Int -> Int -> Int
    euclid a b
      | a == 0    = b
      | b == 0    = a
      | a > b     = euclid (a-b) b
      | otherwise = euclid a (b-a)
  </code>
</pre>

Works fine! But now I also want to have some code lines in my text, inline. Like this:

<p> Info text inline code testing <code class="haskell">{-# OPTIONS_GHC -Wall #-}</code> maybe it works</p>

Doesn't work... You can check them out at my Site

How to make inline code with highlight.js ?

Answer 1

You just need a little CSS to make it inline. How you do it is up to you, but you could make it inline if it's within a p tag.

p > code.hljs { display: inline; }

Example: https://jsfiddle.net/ykyLcvnw/1/