Chroma highlighting using pygmentOptions="linenos=table" bug?

Hugo Version - 0.31.1

In this post on BeautifulHugo, I reported what I thought might be an issue with the theme. Now I’m suspecting it may be a bug in how Hugo generates code highlight blocks when using pygmentOptions="linenos=table".

Quoting from my post in that issue, I am curious of the answer. I’m especially interested if there is something I maybe doing wrong on my end.

Is the intent that code blocks extend the full width of the post? Or is it just expected to be wide enough for the code inside?

If the expectation is that it runs the full width, then the <tbody>, <tr>, and second <td> should extend the full width and currently the only do so if the code lines are long enough.

If the expectation is that the block is only as wide as necessary to contain the code, then the issue seems to be that in the following structure, the <div class="chroma"> has a background-color but probably shouldn’t. Because it does, the dark box on the far right of the image extends the entire width of the column rather than just the width of the code.

<div class="highlight">
  <div class="chroma">
    <table class="lntable">
      <tbody>
        <tr>
          <td class="lntd">
            <pre class="chroma">
              <code ...>
                <span class="lnt">
...

I wrote the “linenos” patch in Chroma, and I fiddled a fair amount to “get it right”. That right may not be right for everyone, but I suspect that it should be styleable to your taste with CSS. You should, however, take any bug report on this with the Chroma author.

Thank you, @bep, I appreciate your insight on this one and especially speedy response. :slight_smile:

I finally got back to this again and opened this issue to see where it leads.