我正在尝试格式化表格,由于某种原因我无法弄清楚,<tbody>
上的溢出无法正常工作(完全):
使用以下CSS:
body,
html {
height: 100%;
margin: 0;
}
.outside {
height: 100%;
display: flex;
flex-flow: column;
background-color: pink;
}
.outside .header,
.outside .footer {
background-color: grey;
font-size: 18px;
color: blue;
}
.content{
flex: 1;
background-color: violet;
}
.data-grid{
table-layout: fixed;
border-collapse: collapse;
}
.data-grid thead{
background-color:lightblue;
}
.data-grid tbody{
height: 100%;
overflow-y:scroll;
}
桌体将页脚向下推,不显示滚动条。
我放置了小提琴here。一点见识将不胜感激。
.outside
样式移至.data-grid
样式: