對齊HTML表格中的圖像

Question

我有一個1x2 HTML表格，它將成爲電子郵件的標題。第一列包含一個鏈接的圖像，第二個標題。

 <table>   
     <tr> 
      <td width="50%" style="text-align:left; padding-left:10%;"> 
       <a target="_blank" href="http://www.google.com/"> 
        <img src="img/logo.jpg" alt="Logo" 
        style="width:30%; height:30%;" 
        /> 
       </a> 
      </td> 

      <td width="50%" style="text-align:right; padding-right:10%;"> 
       <h2>Order Confirmation</h2> 
      </td> 
     </tr> 
    </table> 

正如可以看到，在左單元圖像左對齊，並在正確的細胞的標題對齊右，與從邊緣（填充）10％的空間的每個元素。

問題：我的圖像尺寸被扭曲了！我將img的寬度和高度均設爲30％，但仍然變形。我猜這與桌子有關，但我無法弄清楚。讓我知道！

ps：我必須爲這個項目使用內聯樣式和表格。

Answer 1

如提及以下SO {} Resize image proportionally with CSS?

你不應該試圖和約束兩個維度，只是設置你的寬度30％，你的身高爲「自動」。給那一槍。