Expected behavior When button is clicked, the number bubble - demonstrating the position - on the button should remain.

Actual behavior When clicked, the positioned element is hidden except the portion displayed within the bounds of the button.

Resources (screenshots, code snippets etc.) See the page https://mdbootstrap.com/docs/standard/utilities/position/ and look at the Additional examples section. Click the button.

The current code example is:

<button type="button" class="btn btn-primary position-relative">
  Mails
  <span
    class="position-absolute top-0 left-100 translate-middle badge rounded-pill bg-secondary"
    >+99 <span class="visually-hidden">unread messages</span></span
  >
</button>