Stop auto removing of extra spaces in a button

Product Support

AI-generated summary

The issue is about extra spaces being automatically removed from a customized button text. jimkleiber tried to add spaces between the first character and the rest of the characters but they were condensed to one space. Disabling the title remove extraneous space and title prettify options did not resolve the issue.

jimkleiber even experienced the same issue when posting a screenshot with three spaces in the forum, which was condensed to one space.

jimkleiber was able to resolve the issue after using three   (non-breaking space HTML entity) instead of regular spaces, as suggested by Canapin.

1

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.

2

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

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