Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Using <code> or <samp> within <pre> adds padding to the first line causing a small offset with other lines #705

Open
vivienlacourba opened this issue Jan 17, 2025 · 0 comments
Assignees

Comments

@vivienlacourba
Copy link
Member

Describe the issue

When a code block (using <pre><code>) contains multiple lines, the padding applies to the first line only causing a small offset.
cc @deniak who noticed this issue too.

Suggestion

When used in a <pre> there should be no padding applied to <code> or <samp> or <kbd> (as those will likely contains multiple lines).

URL

Example of page where this issue was spotted:
https://www.w3.org/guide/editor/editors-draft.html#guidelines

How to reproduce the issue

Adding the following markup is enough to reproduce this issue:

<p>Example 1: pre alone</p>
<pre>line 1
line 2
</pre>

<p>Example 2.1: pre+code - which shows the issue</p>
<pre><code>line 1
line 2
</code></pre>

<p>Example 2.2: pre+samp - which also shows the issue</p>
<pre><samp>line 1
line 2
</samp></pre>

<p>Example 2.3: pre+kbd - which does not have the issue as &lt;kbd&gt; does not currently have any specific padding applied</p>
<pre><kbd>line 1
line 2
</kbd></pre>

Screenshot of this example markup:

Image

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
Status: 📋 To do
Development

No branches or pull requests

2 participants