Вертикально совместите изображение и текстовое поле в ячейке таблицы

Question

Что у меня есть:

 XXX 
     XXX 
Google XXX 

Что я хочу:

 XXX 
Google XXX 
     XXX 

Что я пробовал:

<table border="4"> 
<tr> 
<td style="vertical-align: middle; height: 400px"> 
    <img style="vertical-align: middle;" src="http://www.google.se/images/google_80wht.gif" alt="Google logo"> 
    <textarea style="height: 200px; display: inline-block"></textarea> 
</td> 
</tr> 
</table> 

Каким-то образом, изображение не выравнивая вертикально, даже если я поместил vertical-align: middle в стиль ячейки. Текстовое поле выравнивается правильно в центре.

JSFiddle: https://jsfiddle.net/uydmjgby/

Я не могу добавить любой новый столбец или строку, форматирование должно происходить подавление жгутов этой ячейки.

Answer 1

Положите vertical-align: middle на текстовое поле https://jsfiddle.net/uydmjgby/1/