0
我正在使用此表來顯示我的表格數據的摘要。在桌子底部定位div
問題：當我顯示div class="mpst"時，如果文本中的行數存在差異，則此div無法到達表格的底部。
代碼：這裏
.resumo tr {
color: #253037;
background-color:#e9e9e9;
}
.resumo table {
flex-wrap: nowrap; align-items: center;
width: calc(90% + 4vh);
border-collapse: collapse;
margin:0 auto;
text-align:center; \t
table-layout: fixed;
border-collapse: separate;
border-spacing: 2vh 0;
vertical-align: baseline;
border:0;
outline: 0;
}
.resumo td {
font-size: 13px;
padding:0;
outline: 0;
}
.tbpad {
padding-top:4vh;
padding-left:2vh;
padding-right:2vh;
}
.mpst {
background-color:black;
width:calc(94%);
padding:3%;
margin-top:4vh;
margin-left:0;
position:relative;
color:#ffffff;
outline: 0;
}
.stgreen {
background-color: #33CA49;
}
.styellow {
background-color: #FDBD41;
}
td img {
max-width:70%;
height:auto;
vertical-align: middle;
margin-bottom:5%;
}<div class="resumo"> <table id="statuscp"><tbody><tr><td class="status"> <div class="tbpad"><img src="resources/img/transm.png"><p class="pblock">Transm</p></div><div class="mpst styellow">MP > 1K</div></td> <td class="status "> <div class="tbpad"><img src="resources/img/command.jpg"><p class="pblock">Final <br>command LD</p></div><div class="mpst styellow">MP > 1K</div></td> <td class="status "> <div class="tbpad"><img src="resources/img/command.jpg"><p class="pblock">Final <br>command LE</p></div><div class="mpst styellow">MP > 1K</div></td> <td class="status "> <div class="tbpad"><img src="resources/img/engine.jpg"><p class="pblock">Engine</p></div><div class="mpst stgreen">MN > 1K</div></td> </tr></tbody></table></div>任何人誰知道我該怎麼做呢？
謝謝！
也許你不應該在這裏用表格來 - 這不看起來像管狀數據和表不應該用於佈局（除非做一個電子郵件模板） – Pete