Padding issues in highlighted code examples

[cfa]

Tokens in certain highlighted code blocks are incorrectly spaced due to additional horizontal padding provided by the stylesheet.

There are multiple instances of the problem on the Regexes page; a representative example is the spacing around :nth, :1st, etc. under the positional adverb heading.

The cause appears to be the section class in the main stylesheet¹

.section {
  padding: 3rem 3rem;
}

which pads spans like the following

<span class="entity name section adverb regexp paren raku"><span>:nth</span></span>

Footnotes

1. For screen; there's also a fallback to 1.5rem in main.css. ↩

[finanalyst]

Code examples may not be the only styling problem.
Styling comes from several sources: the bulma CSS framework, adaptations for this website, which has separate stylesheets for code and ambient text, adaptations for plugin add ons

[coke]

Following up from an IRC discussion, it is not just padding around the examples, but inside the example itself.

$_ = 'The cat chases the dog';
s:global:samecase[the] = 'a';
say $_;                 # OUTPUT: «A cat chases a dog» 

is the raw source, but the s: here has much more horizontal whitespace inside the example itself; that is, the extra padding isn't just around the example.

[raiph]

Example:

https://docs.raku.org/language/regexes.html#Samecase

[coke]

@raiph++ - the issue is the extra horizontal space on (e.g.) the second line between the s and the :

[finanalyst]

Closing issue as resolved.