Jekyll/Rouge - highlighted code blocks nested

佐手、 提交于 2020-05-12 08:52:31

问题


I have switched from github pages to hosting my own site. As a result of this migration I got the syntax highlighting blocs to be nested.

<div class="highlighter-rouge">
  <div class="highlight">
    <pre class="highlight">
        <code>
        ... ... ...
        </code>
    </pre>
  </div>
</div>

When rendered it looks like:

The style related settings in _config.yml are:

kramdown:                                         
  syntax_highlighter: rouge                                      

sass:                                                     
  style: :expanded

Setting syntax_highlighter: none removes the highlighting related classes (this is just to give more info, the code is just verbatim then, not highlighted in a block):

<pre>
  <code>
  ... ... ...
  </code>
</pre>

Looking for ideas on how to diagnose this further?


回答1:


There seems to have been a related discussion about this previously happening here.

The solution is to modify a css entry in _sass/_highlights.scss so that .highlight is replaced with pre.highlight



来源:https://stackoverflow.com/questions/55305080/jekyll-rouge-highlighted-code-blocks-nested

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!