[GH-ISSUE #195] Wrong margin for `bulletList` #73

New issue

Closed

opened 2026-03-01 14:39:53 +03:00 by kerem · 1 comment

kerem commented

2026-03-01 14:39:53 +03:00

Owner

Originally created by @bernaferrari on GitHub (May 1, 2025).
Original GitHub issue: https://github.com/arikchakma/maily.to/issues/195

github.com/arikchakma/maily.to@b3a6a29b4a/packages/render/src/maily.tsx (L957)

This should be:

      <Container
        style={{
          maxWidth: '100%',
          marginBottom: shouldRemoveBottomMargin ? '0' : '20px',
          marginTop: '0px',
        }}
      >
        <ul
          style={{
            paddingLeft: '26px',
            listStyleType: 'disc',
          }}
        >

The margin needs to be in container, not un ul, so that if there is a divider, the margin from divider compensates with the margin from bullet list. For example:

Preview (see how the divider margin doesn't touch the bullet list):

Editor (see how bullet list is glued with divider margin):

Originally created by @bernaferrari on GitHub (May 1, 2025). Original GitHub issue: https://github.com/arikchakma/maily.to/issues/195 https://github.com/arikchakma/maily.to/blob/b3a6a29b4ac40e3c7a838cc76549dd9f6e412944/packages/render/src/maily.tsx#L957 This should be: ```ts <Container style={{ maxWidth: '100%', marginBottom: shouldRemoveBottomMargin ? '0' : '20px', marginTop: '0px', }} > <ul style={{ paddingLeft: '26px', listStyleType: 'disc', }} > ``` The margin needs to be in container, not un ul, so that if there is a divider, the margin from divider compensates with the margin from bullet list. For example: Preview (see how the divider margin doesn't touch the bullet list): ![Image](https://github.com/user-attachments/assets/79073291-ef22-4567-a8cc-c3a0de61a711) Editor (see how bullet list is glued with divider margin): ![Image](https://github.com/user-attachments/assets/ea3a122e-57cc-4430-a73a-48c47faecd77)