Html 表格元素和溢出滚动条之间出现空格 所以我一直在尝试编写一个表>代码>，它包含了滚动时的主标题/头单元要贴在顶部的信息，但是在制作的过程中，我在整个表的周围做了一个包含 div 元素以允许设置高度> /代码>和溢出< /代码>属性。但是当预览加载时，它显示了表格本身和滚动条之间的间隙。所以我试着做了一些研究，发现我可以通过将表格css部分的所有属性放入display:block，但即使在我这样做之后，之前显示的相同空间仍然很明显，只是它将内容推到了一边。我不需要任何关于粘性标题的帮助，因为我想自己做，但是任何关于滚动条的帮助都会非常有用

另外，与问题无关，我想知道除了默认的浏览器滚动条之外，是否还有其他方法可以将滚动条更改为其他内容

代码笔：

CSS

---

我建议将

.table\u edit

作为

内联块

元素；这将导致元素的尺寸由其包含的元素确定（理想情况下，这是您想要的）。您还需要将

text align:center

添加到父元素，在本例中，我将其添加到

body

元素

---

非常感谢！这解决了我所有的问题。

div.table_edit {
  height: 300px;
  overflow-y: scroll;
  overflow-x: hidden;
  display: inline-block;
}
table {
  text-align: center;
  width: 1210px;
  background: #BABABA;
  padding: 0;
  border-collapse: collapse;
}
th {
  margin: 0;
  width: calc(1210px / 6);
  border: none;
  padding: 15px;

}
#header_row {
  background: #636363;
}
th.titleone {
  background: #292929;
}
td {
  padding: 15px;
  width: calc(1210px / 6);
}
td.namebar {
  background: #404040;
  font-weight: bold;
}
tr.alternating_color {
  background: #9C9C9C;
}
tr:hover {
  background: #808080;
}
tr.a:ternating_color:hover {
  background: #808080;
}

div.table_edit {
    height: 300px;
    overflow-x: hidden;
    overflow-y: auto;
    display: inline-block;
}