Как растянуть изображение PNG до ширины ячейки и сохранить правильное соотношение ячейка / высота

У меня есть таблица с 4 ячейками, равномерно распределенная на 80% ширины экрана. Мои png файлы отображаются правильно, но не заполняют ширину ячеек, поэтому они выглядят плохо.

Я хочу, чтобы высота растягивалась, чтобы поддерживать соотношение. Как я могу это сделать? Я знаю, что могу поставить высоту 100% и ширину = 100% в каждый img, но как я могу использовать css для этого? .styleObj ширина и высота, похоже, не влияют на нее.

<style type="text/css">
    .styleTbl
    {
        margin-bottom:10%;
        margin-left:10%;        
        background: #aeaeae;
        width:80%;

    }
    .styleCol
    {
        background: #ffffff;
    }
    .styleRow
    {
        background: #000000;
    }
    .styleBg
    {
        background: #00aced;

    }
    .style_logo
    {
        width:80%;
    }
    .styleObj
    {
        height:100%;
            width:100%;
    }
    </style>
    <link href="favicon.ico" type="image/x-icon" rel="shortcut icon" />

<img alt="logo_banner Missing" class="style_logo" longdesc="Banner" src="logo_banner.png"/>
<br />
<table class="styleTbl">
    <tr class="styleRow">
        <td class="styleObj">
            <object data=index.html></object></td>
        <td class="styleObj">
            <img alt="png" longdesc="png1" src="png1.png"/></td>
    </tr>
    <tr class="styleRow">
        <td class="styleObj">
            <img alt="png1" longdesc="png1" src="png1.png"/></td>
        <td class="styleObj">
            <img alt="png1" longdesc="png1" src="png1.png"/></td>
    </tr>
</table>