How can I pad an image button?

Unity Engine
1

Hi!

I wish to have a refresh button with padding around the image.

<ui:Button name="RefreshButton"/>

I added the following css

#RefreshButton {
    height: 16px;
    width: 16px;
    background-image: resource('d_Refresh');
    align-self: flex-end;
}

Which looks fine, except that there is no padding around the image.

7553371--933904--upload_2021-10-7_10-4-58.png

But no matter what I try, I have not managed to add padding around the image without stretching it. This is what it ends up looking like if I add padding, or increase the height, width:

7553371--933907--upload_2021-10-7_10-5-46.png

Anyone know how to make it look like this (from the Package Manager)?

7553371--933910--upload_2021-10-7_10-8-30.png

2

Use the Image element. It has an image inside another VisualElement, which allows for padding.

1 Like
3

Thanks!

1 Like