iT邦幫忙

0

div動態高度問題

舜~ 2020-08-01 18:28:592700 瀏覽

問一下,

我在表格內有一個div,想要填滿整個儲存格
但因為旁邊的儲存格有使用到bootstrap的折疊(Collapse)元件導致整行高度無法固定
因此沒辦法直接設height:100%

換個想法改讓div元件距離上下左右邊界距離是0,
來撐大div
td跟div都上m-0跟p-0結果沒變,
無法如預期填滿整個表格...

好像只能透過js來處理??????
網路上看到有人的處理方式是每隔幾微秒就重新偵測並重設全部div高度,這是唯一解?
另一個方式是resize,但他只能用在windows

問一下tr/td的高度變化是否會觸發什麼事件????
或有沒有讓div填滿整個儲存格的方法???

目前我寫的自動改變高度,但他只能一次性,且變大就回不去了...

// div有一個固定的class是shift-box
// 當前儲存格多高就設定為多高
$('.shift-box').each(function () {
   let h = $(this).parents('td').height();
   $(this).css('min-height', h);
});

感恩

Luis-Chen iT邦新手 4 級 ‧ 2020-08-03 23:43:28 檢舉
grid 就可以了吧?
舜~ iT邦高手 1 級 ‧ 2020-08-04 08:35:19 檢舉
您指的是表格內使用bootstrap的grid? 可以自動調整高度?
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

1 個回答

1
listennn08
iT邦高手 5 級 ‧ 2020-08-02 01:23:33
最佳解答

這樣?
codepen

舜~ iT邦高手 1 級 ‧ 2020-08-02 14:18:20 檢舉

挖,是的,感恩前輩~~~

原來在外面的td上設height:1px (設0也可以XD)
裡面的div設height:100%
就可以有高度,可自動填滿了~~~

我要發表回答

立即登入回答