html中div取消间隙,CSS：为什么td和div之间出现间隙？

在我制作的表格中，每当单元格只有一点内容时，td和div之间就会出现间隙 - 但看起来很正常，但内部有很多东西。这看起来很奇怪。有人可以帮我删除它吗？CSS：为什么td和div之间出现间隙？

HTML：

[@inicio] - [@fim]

[@disciplina]

[@professor]

CSS：

table {

border-spacing: 10px;;

border-collapse: separate;

width: 100%;

}

tr, td, th {

border: #000 solid 1px;

-webkit-box-shadow: 3px 2px 0px 0px rgba(0, 0, 0, 0.45);

-moz-box-shadow: 3px 2px 0px 0px rgba(0, 0, 0, 0.45);

box-shadow: 3px 2px 0px 0px rgba(0, 0, 0, 0.45);

}

td:hover {

border: rgb(80, 0, 0) solid 1px;

cursor:pointer;

-webkit-box-shadow: 3px 2px 0px 0px rgba(80, 0, 0, 0.45);

-moz-box-shadow: 3px 2px 0px 0px rgba(80, 0, 0, 0.45);

box-shadow: 3px 2px 0px 0px rgba(80, 0, 0, 0.45);

}

.headler {

background-color: rgb(145, 0, 0);

text-align: center;

padding: 4% 0%;

margin: 0;

}

.valores_resultados{

min-height: 60px;

text-align: center;

}

.disciplina {

margin-top: 3%;

}

.professor {

margin-bottom: 4%;

}