Spacing issue with image placed in table - HTML and CSS - html

Question

I'm building a table for my website, and I'm trying to place a logo inside of a data cell. The issue is that whenever I add the picture, the margins go really weird and I can't figure out why spacing is added. I tried to remove the padding and margins on the image, and the cell itself, but nothing fixes it.
Before image:
After image:
HTML:
<table class="table">
<thead class="tablehead">
<tr>
<th>Language</th>
<th>Year Initiated</th>
<th>Projects</th>
</tr>
</thead>
<tbody class="tablebody">
<tr>
<td><img src = "images/Java_Logo.png" class="tableimage"></td>
<td>2015</td>
<td>ENTER LINK</td>
</tr>
<tr>
<td>C#</td>
<td>2016</td>
<td>ENTER LINK</td>
</tr>
<tr>
<td>Python</td>
<td>2018</td>
<td>ENTER LINK</td>
</tr>
<tr>
<td>HTML and CSS</td>
<td>2018</td>
<td>ENTER LINK</td>
</tr>
</tbody>
</table>
CSS:
.table{
margin: auto;
}
.tablehead{
font-family: permanent marker;
font-size: 24px;
}
.tablebody{
font-family: body;
font-size: 20px;
}
.tableimage{
width: 15%;
padding:0px;
margin: 0px;
}
th, td{
border-bottom: 1px rgb(146, 40, 40) solid;
padding: 10px;
margin: 0;
}
I've also already tried multiple different images, so this does not seem to be the issue. I'd like all three columns to take up 1/3 of the space each.

Answer 1

Another option is to use this, which changes the behavior of the table overall. (Set your preferred width, or nothing at all):
table {table-layout: fixed; width: 50%;}

Answer 2

You only need to specify a width for the table cells. Try adding this to your CSS:
th, td {
width: 33%;
}

Answer 3

The table must some other css affecting it. When I put your code into JSFiddle, it seems to work the way you want. See example: https://jsfiddle.net/ruben/xg2joc1y/5/
You could try adding some css to your image:
.table img {
display: inline;
}