I just recently came across a bug, I saw a post with code like this foo bar
, with (`), but somehow it became like this:
It went under the "Featured on Meta" and "The Overflow Bug" banners and went out of the page...
This is surely a bug...
I just recently came across a bug, I saw a post with code like this foo bar
, with (`), but somehow it became like this:
It went under the "Featured on Meta" and "The Overflow Bug" banners and went out of the page...
This is surely a bug...
Give it 6 to 8 weeks as usual.
In the meantime, you can use the following techniques to work around that:
Switch inline code of this size to a code block by using fences (triple backticks) or four-space indentation as chances are there's simply a lot of significant whitespaces, or it should've been a multiline block in the first place:
this line is quite long (you should see a horizontal scroll bar)
Fixed image for posterity:
Use the force a custom CSS ruleset to override the display
rule for <code>
elements to inline-block
(see MDN) which makes them take the best of both worlds (inline view for short blocks, multiline view for long blocks):
code {
display: inline-block;
}
Here is how this would look like for long blocks (short ones will stay the same):
As an alternative CSS technique, you can override the white-space
rule to break-spaces
for <code>
elements instead (see MDN ref). This gives a similar result but preserves the inline appearance even if the code ends up spanning multiple lines:
code {
white-space: break-spaces;
}
And here is how it would look like:
<pre><code></code></pre>
<code>
adisplay: inline-block
rule (example of the result)