5
दोनों टेबलों की ऊंचाई ऊंचाई 50px है और उनकी सामग्री बहती नहीं जा रही है। लेकिन एक कैप्शन वाली तालिका वास्तव में 70px है, क्योंकि कैप्शन तालिका की ऊंचाई गणना में शामिल नहीं होता है।तालिका-कैप्शन टेबल की ऊंचाई क्यों बढ़ाता है?
क्या कोई तालिका ऊंचाई की गणना में कैप्शन समेत तर्कसंगत समझा सकता है?
यह सब के बाद तालिका का एक बच्चा है। और यदि आप इसे टेबल ऊंचाई से बाहर करना चाहते हैं, तो यदि आप इसे शामिल नहीं करना चाहते हैं तो तालिका के बाहर तालिका को कैप्शन कर सकता है।
.table {
display: table;
height: 50px;
}
.table-caption {
display: table-caption;
background-color: red;
height: 20px;
}
.table-row {
display: table-row;
background-color: green;
}
.table-cell {
display: table-cell;
}<div class="table">
<div class="table-row">
<div class="table-cell">table height is 50px</div>
</div>
</div>
<br>
<div class="table">
<div class="table-caption">caption</div>
<div class="table-row">
<div class="table-cell">table height is 70px</div>
</div>
</div>
