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

Bad HTML rendering of sub-indented list item #1065

Open
1 task done
jgscudder opened this issue Dec 20, 2023 · 4 comments
Open
1 task done

Bad HTML rendering of sub-indented list item #1065

jgscudder opened this issue Dec 20, 2023 · 4 comments
Labels
bug Something isn't working html Issues in HTML output

Comments

@jgscudder
Copy link

Describe the issue

When viewing https://www.ietf.org/archive/id/draft-ietf-rift-rift-19.html#name-floodstate-structure-per-ad, the second list item under "try_to_transmit_tie(TIE):" renders weird in Safari (Version 17.2 (17617.1.17.11.11, 17617) on my Mac, also Safari on my iPad). Image attached. Warren says it renders fine in his non-Safari browser (unspecified, maybe Chrome, but he says the version string is Version 120.0.6099.109 (Official Build) (arm64)...). But interestingly, even his "fine" rendering differs from the ASCII rendering.

The ASCII rendering looks like,

try_to_transmit_tie(TIE):
A. if not is_flood_filtered(TIE) then

      1.  remove TIE from TIES_RTX if present

      2.  if TIE" with same key is found on TIES_ACK then

          a.  if TIE" is same or newer than TIE do nothing else

The "good" HTML rendering looks like,

try_to_transmit_tie(TIE):
A. if not is_flood_filtered(TIE) then

  B. 1.  remove TIE from TIES_RTX if present

      2.  if TIE" with same key is found on TIES_ACK then

          a.  if TIE" is same or newer than TIE do nothing else

Note the "B" which is not present in the ASCII.

The "bad" HTML rendering looks like the good one, but the "B" and the "1" are overprinted on top of one another, at the indent level of the "1".

Screenshots of the different renderings are attached.
image_from_ios_720
image_720
image_from_ios_720

Code of Conduct

@jgscudder jgscudder added the bug Something isn't working label Dec 20, 2023
@rjsparks rjsparks transferred this issue from ietf-tools/datatracker Dec 20, 2023
@kesara kesara added the html Issues in HTML output label Dec 20, 2023
@kesara
Copy link
Member

kesara commented Dec 20, 2023

I can reproduce this on Safari Version 17.2.1 under macOS.

@kesara
Copy link
Member

kesara commented Dec 20, 2023

Looks like the li marker is moving with the nested ol in safari when there's are no text.
Example:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Numbered List Example</title>
</head>
<body>

    <h1>Numbered List Example</h1>

    <p>This is a simple HTML page with a numbered list:</p>
    <ol start="1" type="A">
        <li>Item 1</li>
        <li>
          <ol style="margin-left: 1em" start="1" type="1">
            <li>Item x</li>
            <li>Item y</li>
          </ol>
        </li>
        <li>
          Item 3
          <ol style="margin-left: 1em" start="1" type="1">
            <li>Item p</li>
            <li>Item q</li>
          </ol>
    </ol>
</body>
</html>

Safari 17.2.1:
Screenshot 2023-12-21 at 10 17 39

Firefox 120.0:
Screenshot 2023-12-21 at 10 17 48

Google Chrome 120.0:
Screenshot 2023-12-21 at 10 17 46

@larseggert
Copy link

It's not just an HTML rendering issue between browsers though. Note that the ASCII rendering is missing B. entirely.

@kesara
Copy link
Member

kesara commented Dec 21, 2023

It's not just an HTML rendering issue between browsers though. Note that the ASCII rendering is missing B. entirely.

@larseggert I created a new issue for the text bug since it will require a separate fix.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working html Issues in HTML output
Projects
None yet
Development

No branches or pull requests

3 participants