這個問題在這里已經有了答案： 如何將外部 div 的高度設定為始終等于特定的內部 div？ (2 個回答) CSS - 等高列？ (11 個回答) 6 小時前關閉。
我有這個 div：
<div class="middle"></div>
它每天都充滿了 API 資料，而且它的高度每天都在變化。
我有這些其他的div：
<div id="right" class="sideScoreDiv"></div>
<div id="left" class="sideScoreDiv"></div>
我想讓這些這個 div 等于中間 div 的高度，我該怎么做呢？我嘗試將高度設定為 100%，但這對我不起作用。我還嘗試了其他建議的方法，例如隱藏溢位，但在動態創建的 div 上找不到任何內容。
uj5u.com熱心網友回復：
這個問題的一個很好的解決方案是網格布局。例如，在下面的代碼片段中，元素被插入到 parent 的第一個子元素中，并且第二個 div 的高度發生變化以匹配。
<div class="parent-container">
<div id="left">
left
</div>
<div id="content">
<!-- for example, fill it with a list -->
<!-- this data can be anything though -->
<ul></ul>
</div>
<div id="right">
right
</div>
</div>
<style>
.parent-container {
background-color: rebeccapurple;
display: grid;
/* adjust these columns to change widths */
grid-template-columns: 10rem auto 10rem;
}
/* just to make things look a bit nicer */
#left, #right {
padding: 1rem;
background-color: paleturquoise;
}
</style>
<!-- script to simulate dynamic data -->
<script>
setInterval(() => {
const parent = document.querySelector('ul');
const entry = document.createElement('li');
entry.innerText = 'data';
parent.appendChild(entry);
}, 1000);
</script>uj5u.com熱心網友回復：
我認為您正在尋找 網格或flex伴侶。
轉載請註明出處，本文鏈接：https://www.uj5u.com/ruanti/484848.html
標籤：javascript html css