防止使用jekyll、kramdown和rouge换行代码块

Question

在jekyll博客中使用kramdown和rouge进行标记语法高亮显示，我希望防止长行代码换行。我希望能够使用水平滚动条来显示其余内容。

这是jekyll配置：

markdown: kramdown
kramdown:
  input: GFM
  syntax_highlighter: rouge

我使用的是rougify命令生成的base16.solarized.darkCss主题。

下面是一个代码用法示例：

```` js
console.log("some code") // and a really really long long long comment which i'd like to not wrap onto the next line
````

Answer 1

Boostrap正在添加一个white-space: pre-wrap规则，以帮助代码块的可读性。

如果你想让你的代码块避免这种包装，你可以编辑css/data-css并添加

pre code{
  white-space: pre;
}

Answer 2

您有一个CSS规则，用于code元素设置white-space: pre-wrap。添加以下规则以覆盖它：

code {
    white-space: pre;
}

Answer 3

我这样解决了它：

pre {
    ...
    overflow-x: scroll;
}