Truncation underline bridge

[benalleng]

Closes #789

Before:

After:

[cloudflare-workers-and-pages[bot]]

Deploying with    Cloudflare Pages

Latest commit:	3667cfb
Status:	✅  Deploy successful!
Preview URL:	https://104c4886.mutiny-web.pages.dev
Branch Preview URL:	https://tx-underline.mutiny-web.pages.dev

View logs

[futurepaul]

doesn't look quite right on mac chrome. I haven't messed with this in a while but is there a reason we don't just use a <span>…</span> here?

[benalleng]

So a normal span doesn't work exactly as I want because the behavior of an overflow is to clip instead of delete characters so we end up with something like below when using <span>…</span> curious if you think you prefer this over trying to adjust the <hr/> for all browsers

[benalleng]

I tried setting a default underline offset as it seems like there is a difference between those defaults on firefox and chrome, I tested it myself on a few browsers but I haven't gotten a chance to test on mac

[futurepaul]

it's worse on safari for some reason:

So a normal span doesn't work exactly as I want because the behavior of an overflow is to clip instead of delete

ah, the pain is coming back to me lol

[futurepaul]

yeah maybe this can be fudged a bit with some margins or negative margins?

[benalleng]

Ok i tried again with some adjustments, I ended up not using relative with positioning and instead opted for a browser based negative margin, also tested on my girlfriend's iPhone and it looks like it worked! Let me know if you're cool with the browser based styling