在我制作的表格中,每当一个单元格只有一点内容时,td 和 div 之间就会出现一个间隙 - 但是当里面有很多东西时它看起来很正常。这看起来很奇怪。有人可以帮我删除它吗?
HTML:
<td cod='[@cod]'>
<div class="headler">
[@inicio] - [@fim]
</div>
<div class="valores_resultados">
<div class="disciplina" cod="[@cod_disciplina]">
[@disciplina]
</div>
<br>
<div class="professor" cod="[@cod_prof]">
[@professor]
</div>
</div>
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%;
}
最佳答案
将您的 CSS 更改为:
table {
border-collapse: collapse;
}
关于html - CSS:为什么 td 和 div 之间会出现间隙?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34774149/