リキッドレイアウトでHTMLを組んだ際に、画像サイズも自動的に縮小されて欲しいと思い、widthにパーセンテージを指定しました。
幅の異なる画像を隙間なく並べた場合に、縮尺の関係から縦幅がずれてしまい見栄えがよくありません。
この現象を解消したいのですが良い方法はありますでしょうか。
全体的にリキッドレイアウトにしたいので、heightに具体的なサイズを指定することはできません。
以下が当該箇所のHTMLです。よろしくお願いいたします。

<table cellpadding="0" cellspacing="0" border="0" height="100%" width="95%" bgcolor="#FFF" style="border-collapse:collapse;">
<tr>
<td>
<!-- wrapper : start -->
<table border="0" width="100%" cellpadding="0" cellspacing="0" align="center" style="max-width:700px; margin:auto;" class="email-container">
<tr>
    <td>

        <table border="0" width="100%" cellpadding="0" cellspacing="0" align="center">
            <tr>
                <td width="49%" style="vertical-align:top; font-size:0; line-height:0;">
                    <img  width="100%"  src="img/left.jpg" style="display: block;" alt="LEFT">
                </td>
                <td width="51%" style="vertical-align:top; font-size:0; line-height:0;">
                    <img  width="100%" src="img/right.jpg" style="display: block;" alt="RIGHT">
                </td>
            </tr>
        </table>

    </td>
</tr>    
</table>
<!-- wrapper : end -->
</td>
</tr>
</table>