"Vertical Alignment : Center" not working in case of iPad and iPhone

Step 1 : Add a "Sprite" object (size 100 x 100)

Step 2 : Add a "Text" object (size 100 x 100)

Step 3 : Keep vertical and horizontal alignment of the text as "Center"

Step 4 : Place the "Text" object on top of "Sprite" object added in step number 1

Step 5 : Add some text inside the textbox. (e.g: Yes/No/Done/Cancel etc.)

Step 6 : Export the project.

Observation 1 : Text alignment works fine in Windows Desktop/Laptop with Chrome browser.

Observation 2 : Text alignment works fine in MacOS MacBook with Safari browser.

Observation 3 : But the text is not getting aligned vertically (at the center position) in case of iPad and iPhone.

Kindly help.

fedca Request you to kindly throw some light if you've come across this sort of observation.

I have observed the text alignment to be inconsistent across platforms as well.

But I sadly don't really now why or how to fix it. (I also don't have different devices to test)

I just try to make sure the textbox is a good bit larger then the text and is in a place where slight misalignment isnt't that obvious.

Thanks fedca. Appreciate your quick reply. The requirement is to create a simple button with "Sprite" and "Text" object. So, unfortunately cannot make the "Text" object bigger. Need to limit the size of the "Text" object.

Hi Ashley, this observation seems to be related with the browser rendering.

Request you to provide your expert comments if there's an alternate way to align the text vertically center in case of iPAD and iPhone.

I would guess this is because Chrome and Safari don't yet agree on how text is vertically aligned on canvases: bugs.webkit.org/show_bug.cgi

I'm afraid there's not much to be done about it at the moment.

Thanks Ashley for your informative reply.