Highlighted lines in code snippets don't take full width
Closed this issue · 2 comments
dimitrisnl commented
The problem arises when there is a scrollbar present. More here
However, you will notice that when a highlighted line runs wider than the surrounding code block container (causing a horizontal scrollbar), its background won’t be drawn for the initially hidden, overflowing part. :(
This website isn't using gatsby-remark-prismjs but the problem is similar
kentcdodds commented
Hey, thanks! Would you like to submit a fix? 😄 https://github.com/kentcdodds/kentcdodds.com/blob/86b153136d485c604913e45f93a8f119b40021fb/src/components/layout.js#L116-L121
dimitrisnl commented
Sure, can try.
Edit: Although the changes should be done here
Since we don't want pre to wrap but have a wrapper element do it.