line with backtick or code block
line with backtick or code block
Why is the first line automatically indented by one space when using backticks or <code> tags to surround multiple lines?
Is this intentional or a design flaw?
Add a comment
|
1 Answer
The padding of the <code> element is set to 1px 5px 1px 5px, thus indenting the left and right by five pixels. This makes sense because inline code needs to be properly spaced and it'd look weird without the padding.
Why does it look weird when using it for multiple lines? Because <code> is not meant for that. <code> is for inline formatting. You should use <pre></pre> instead if you want a block element.
Compare the incorrect backtick / <code> variant:
<code>multiline
foo</code>
Which renders as:
multiline
foo
And the correct:
<pre>
multiline
foo
</pre>
Which renders as:
multiline foo
Always use the latter for multiline code. You can of course indent code by four spaces as well to achieve the same thing. Or press CtrlK to indent selected text with our editor.
multiline
foo
-
Hm, I stumbled upon this while trying to correct this question. Now, If I replace
<code>with<pre>it will add a line break. While this would suit in this case, there are probably cases where I want to avoid line breaks. What then?– nixdaCommented Aug 11, 2013 at 13:13 -
Also, you can indent multi-line code with 4 spaces (Ctrl+K) and wrap inline code in backticks (also Ctrl+K).– Oliver Salzburg ModCommented Aug 11, 2013 at 13:23
-
@nixda In cases like the question you linked to it'd probably make sense to use a bulleted list and not use code formatting at all — after all, it's not code or some command here, but just the names of some settings.– slhck ModCommented Aug 11, 2013 at 13:38
-
Though
<pre>(currently) is styled using a fixed-width font, I'd say for code one should use<pre><code>. (Which is exactly what using the four spaces Markdown gets one. Using the four spaces also gets one automatic encoding of HTML entities such as changing<strong>into<strong>.)– ArjanCommented Aug 15, 2013 at 7:52 -
@Arjan True, that is the semantically correct way. The problem is that after
<pre><code>you'll get an extra line break if you start the code on the next line.– slhck ModCommented Aug 15, 2013 at 7:54