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

Question

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

这是 jekyll 配置:

markdown: kramdown
kramdown:
  input: GFM
  syntax_highlighter: rouge

我正在使用 rougify 命令生成的 base16.solarized.dark css 主题。

这是一个示例代码用法:

```` 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-creative.css 并添加

pre code{
  white-space: pre;
}