Table-cell has different height on chrome if image content has height in decimals

Question

I have a table with several columns. On chrome, the height of the table-cell (td) with an image inside varies when image height is in decimals (e.g. 76.54px) On firefox and IE this works fine and all tds have same height.

Please see the following fiddle: https://jsfiddle.net/sstzg0rh/3/

Height of the column with image is few point less pixels then the other columns. This works fine on firefox and all tds have same height. Why chrome is showing different behavior with column height and how to fix this

<div class="container-row">
<div class="container">
    <table>
        <thead>
            <tr>
                <th>Title</th>
                <th>Image</th>
                <th>Text</th>
            </tr>
        </thead>
        <tbody>
            <tr>
                <td>
                    ABCDEFG
                </td>
                <td>
                    <img src="http://via.placeholder.com/74x90" alt="This is a no image">  
                </td>
                <td>
                    ABCDEFG
                </td>
            </tr>
            <tr>
                <td>
                    ABCDEFG
                </td>
                <td>
                    <img src="http://via.placeholder.com/74x90" alt="This is a no image">  
                </td>
                <td>
                    ABCDEFG
                </td>
            </tr>
        </tbody>
    </table>
</div>

body {
    line-height: 1.5;
}

img {
    max-width: 72px;
}

table {
    border-collapse: collapse;
    border-spacing: 0;
    width: 100%;
}

tr {
    min-height: 80px;
    width: 100%;
    border-bottom: 1px solid red;
}

td {
    white-space: nowrap;
    vertical-align: top;
}

Answer 1

I thought your img elements was a inline elements that led to the problem.

The solution i thought was

img{
display:block;
}