Inline links with large activation (touch) target

An attempt to make the effective activation (touch) target for an inline link large enough to make it comfortably clickable/tappable. Relies on setting a generous padding (visualised here with a light green background), pulled back on the left and right by an equal amount of negative margin, combined with some CSS pointer-events juggling to make sure clicks/taps go through any of the subsequent lines of text in the paragraph. Of course, this is still problematic when two links on separate lines are too close together, with their effective activation targets overlapping...but it's perhaps a start. Additionally, this demo also forces a focus outline that's inset by the same amount as the padding.

Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut link labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem link ipsum dolor sit amet, consetetur sadipscing elitr, link sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum link dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor link invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.