Can't center vertically multiple(all) td of a table(Responsive) - html

Question

I am unable to center vertically all td of the table.
It looks okay(vertically centered) in 600px but in mobile devices(max-width:550px) all td of the table is not vertically centering.
I want all text to be vertically centered. How to do this? Don't use float, position:relative/absolute because I am trying to make a html newsletter that doesn't support float/position:relative/absolute.
#media only screen and (max-width:550px) {
.hp {width:100%!important; height:auto!important;}
.mob-column {float:none!important; width:100%!important; display:block!important;}
}
<table width="600" class="hp" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="33.33%" height="192" class="mob-column" align="left"
style="width:33.33%; height:192px; background-image:url('https://via.placeholder.com/200X192.jpg'); background-repeat:no-repeat; background-size:100% 100%;"
bgcolor="#000080">
<!--[if (gte mso 9)|(IE)]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" width="33.33%" align="left" fill="true" stroke="false" style="width:33.33%; height:192px; background-image:url('https://via.placeholder.com/200X192.jpg'); background-repeat:no-repeat; background-size:100% 100%;" class="mob-column">
<v:fill type="cover" src="images/chicken-food.jpg" color="#000080"/>
<v:textbox style="mso-fit-shape-to-text:true;" inset="0,0,0,0">
<![endif]-->
<table width="100%" class="hp" border="0" cellspacing="0" cellpadding="0"
style="text-align:center; color:#ffffff;">
<tr>
<td
style="padding:0px 20px 32px 20px; font-family:'Roboto', Arial; font-weight:900; font-size:15.43px; text-transform:uppercase; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">Chicken Food</span></td>
</tr>
<tr>
<td
style="color:#cac8c6; font-family:'Montserrat', Arial; font-weight:900; font-size:10.29px; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">From</span></td>
</tr>
<tr>
<td
style="padding:0px 20px 0px 20px; font-family:'Roboto', Arial; font-weight:900; font-size:25.89px; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">$10.99</span></td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
<td width="33.33%" height="192" class="mob-column" align="left"
style="width:33.33%; height:192px; background-image:url('https://via.placeholder.com/200X192.jpg'); background-repeat:no-repeat; background-size:100% 100%;"
bgcolor="#000080">
<!--[if (gte mso 9)|(IE)]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" width="33.33%" align="left" fill="true" stroke="false" style="width:33.33%; height:192px; background-image:url('https://via.placeholder.com/200X192.jpg'); background-repeat:no-repeat; background-size:100% 100%;" class="mob-column">
<v:fill type="cover" src="images/pizza-specials.jpg" color="#000080"/>
<v:textbox style="mso-fit-shape-to-text:true;" inset="0,0,0,0">
<![endif]-->
<table width="100%" class="hp" border="0" cellspacing="0" cellpadding="0"
style="text-align:center; color:#ffffff;">
<tr>
<td
style="padding:0px 20px 32px 20px; font-family:'Roboto', Arial; font-weight:900; font-size:15.43px; text-transform:uppercase; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">Pizza Specials</span></td>
</tr>
<tr>
<td
style="color:#cac8c6; font-family:'Montserrat', Arial; font-size:10.29px; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">From</span></td>
</tr>
<tr>
<td
style="padding:0px 20px 0px 20px; font-family:'Roboto', Arial; font-weight:900; font-size:25.89px; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">$10.99</span></td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
<td width="33.33%" height="192" class="mob-column" align="left"
style="width:33.33%; height:192px; background-image:url('https://via.placeholder.com/200X192.jpg'); background-repeat:no-repeat; background-size:100% 100%;"
bgcolor="#000080">
<!--[if (gte mso 9)|(IE)]>
<v:rect xmlns:v="urn:schemas-microsoft-com:vml" width="33.33%" align="left" fill="true" stroke="false" style="width:33.33%; height:192px; background-image:url('https://via.placeholder.com/200X192.jpg'); background-repeat:no-repeat; background-size:100% 100%;" class="mob-column">
<v:fill type="cover" src="images/precious-wine.jpg" color="#000080"/>
<v:textbox style="mso-fit-shape-to-text:true;" inset="0,0,0,0">
<![endif]-->
<table width="100%" class="hp" border="0" cellspacing="0" cellpadding="0"
style="text-align:center; color:#ffffff;">
<tr>
<td
style="padding:0px 20px 32px 20px; font-family:'Roboto', Arial; font-weight:900; font-size:15.43px; text-transform:uppercase; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">Precious Wine</span></td>
</tr>
<tr>
<td
style="color:#cac8c6; font-family:'Montserrat', Arial; font-size:10.29px; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">From</span></td>
</tr>
<tr>
<td
style="padding:0px 20px 0px 20px; font-family:'Roboto', Arial; font-weight:900; font-size:25.89px; line-height:150%; word-spacing:0px; letter-spacing:0px;">
<span class="fallback-text">$10.99</span></td>
</tr>
</table>
<!--[if (gte mso 9)|(IE)]>
</v:textbox>
</v:rect>
<![endif]-->
</td>
</tr>
</table>