When formatting some languages, rouge will insert explicit whitespace spans, which use the exact same class as that on the main page body. This gives them a bunch of weird extra padding.
```json
no space
1 space
2 space
3 space
4 space
```
Becomes
<pre><span class="err">no</span><span class="w"> </span><span class="err">space</span><span class="w">
</span><span class="mi">1</span><span class="w"> </span><span class="err">space</span><span class="w">
</span><span class="mi">2</span><span class="w"> </span><span class="err">space</span><span class="w">
</span><span class="mi">3</span><span class="w"> </span><span class="err">space</span><span class="w">
</span><span class="mi">4</span><span class="w"> </span><span class="err">space</span><span class="w">
</span></pre>
The workaround I've got for now is:
.highlighter-rouge .w {
max-width: unset;
margin: unset;
padding: unset;
}
When formatting some languages, rouge will insert explicit whitespace spans, which use the exact same class as that on the main page body. This gives them a bunch of weird extra padding.
Becomes
The workaround I've got for now is: