Button element not firing click event when clicking on button text and releasing off it (but still inside the button)?

It turns out to be a bug in WebKit.

An quick non-JavaScript solution is to wrap the text in a SPAN element and make it click-through:

<button>
    <span>Click Me</span>
</button>

Example CSS:

span {
    display: block;
    padding: 20px;
    pointer-events: none;   // < --- Solution!
}

Since the bug appears only in WebKit, browsers that don't support pointer-events can be ignored.