Olá galera do fórum, estou com a seguinte dúvida, conforme a imagem em anexo, tenho uma tabela que irá receber dados do banco de dados, ocorre que dentro da tabela preciso incluir uma imagem (botão) que servirá para editar estes dados, meu problema é que logo abaixo da imagem, o html insiste em incluir um espaço vazio dentro da tabela, já editei o código de n maneiras mas não tem como tirar esse espaço, abaixo o código.
HTML:
<table id="listagem">
<thead>
<tr id = "titulo">
<th id = "A">A</th>
<th id = "B">B</th>
<th id = "V">C 1</th>
<th id = "D">D 2</th>
<th id = "E">E/Excluir</th>
</tr>
</thead>
<tbody>
<tr id = "tabela">
<td id = "A">A</td>
<td id = "B" >B</td>
<td id = "V">C</td>
<td id = "D">D</td>
<td id = "E"><img id = "voltar" src="img/volta.png"></td>
</tr>
</tbody>
</table>
<br>
CSS:
table#listagem
{
border: hidden;
border-spacing: 1px;
background: #888888;
width: 768px;
margin-left: auto;
margin-right: auto;
}
table#listagem tr#titulo
{
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-size: 14px;
height: 30px;
text-align: center;
background-color: #CCCCCC;
color: #333333;
}
table#listagem tr#tabela
{
font-family: Cambria, "Hoefler Text", "Liberation Serif", Times, "Times New Roman", serif;
font-size: 14px;
height: auto;
text-align: center;
background-color: #DDDDDD;
color: #333333;
}
table#listagem td#A
{
width: 75px;
}
table#listagem td#B
{
width: 300px;
}
table#listagem td#C
{
width: 125px;
}
table#listagem td#D
{
width: 125px;
}
table#listagem td#E
{
width: 100px;
vertical-align: middle;
}