Stop auto removing of extra spaces in a button

I’ve customized the button text for the login and sign up buttons and I’m trying to add a few extra spaces between the first character and the rest of the characters.

For example, something like:
image

However, when the button shows on the screen, it shows as such:
x Login
with the three spaces removed down to one.

When I inspect the <span class="d-button-label">, it shows x Login but if I double click on that text, it shows the original
image with the three spaces.

I tried disabling the title remove extraneous space and the title prettify but neither worked.

Does anyone know why this might be happening and what I could do to fix it?

EDIT: I had to edit this post and put in a screenshot for the one with the three spaces because it was happening here as well.

Does it work if you use three &nbsp; (non-breaking space HTML entity) instead of spaces in your HTML code?

<span class="d-button-label">x&nbsp;&nbsp;&nbsp;Login</span>

image

Without non-breaking spaces:
image

3 Likes

Yes it does! :man_facepalming:t2: So simple, thank you!

1 Like

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.