Ränder in Klick-Hitbox einbeziehen [geschlossen] ⇐ HTML

[Anonymous]

Ich möchte dafür sorgen, dass die Klick-Hitboxen aller Elemente in einem Baum ihre Ränder enthalten. Ich dachte, eine gute Möglichkeit, dies zu tun, wäre, die Elemente in ein anderes Element ohne Auffüllung und Rand einzuschließen und den Klick-Listener an das Wrapper-Element zu binden.Aber ich kann keine gute Option für einen Wrapper finden, der Inline- und Blockelemente gleichermaßen umschließen kann.
Ich habe gelesen, dass das kann Wrap-Block-Elemente, aber in meinen kurzen Tests scheint das überhaupt nicht zu stimmen. In der Demo unten wird es geschlossen, wenn geöffnet wird.
Gibt es eine bessere Lösung?

Code: Select all

.wrapper {
display: inline-block
}

Code: Select all

The content I want to wrap:

wrap this pwrap this spanwrap this b[/b]
[b]
wrap this h2

div (valid but changes layout):


wrap this pwrap this spanwrap this b[/b]
[b]
wrap this h2

a (not valid, cannot wrap block elements):


wrap this pwrap this spanwrap this b[/b]
[b]
wrap this h2

span (not technically valid):


wrap this pwrap this spanwrap this b[/b]
[b]
wrap this h2

div inline-block (makes everything inline and has formatting issues like the p gets closed early):

wrap this pwrap this spanwrap this b[/b]


wrap this h2