How to center on X and Y axes the alternative text of the img tag?

How can I configure CSS to always leave the middle text in half in the <img/> tag in Google Chrome browser?

In firefox I only use display: flex or inline-flex with align-items: center and justify-content: center but unfortunately it is not a crossbrowser solution.

#Img {
background-color: rgb(0,0,0);
display: inline-flex;
align-items: center;
justify-content: center;
color: rgb(255,255,255);
width: 200px;
height: 100px;
}

<img id='Img' src="" onerror="this.alt = 'Can't speak Hello world!'" alt="Hello wolrd">