動態顯示/隱藏列/行中顯示：-MS-電網

Question

我有使用display: -ms-grid，爲了討論一類，假設它的定義如下：

.gridDiv { 

    display: -ms-grid; 
    -ms-grid-rows: 1fr; 
    -ms-grid-columns: 200px 400px 200px; 

} 

有沒有辦法隱藏的一個我的列通過css或js在運行時？我隱藏了其中的元素，但是我想粉碎.gridDiv，以便它只顯示兩列。

任何想法讚賞。

Answer 1

這可以在您的.js文件中完成。需要確保在此之後需要時再次佈置元素。

var gridDiv = this.element.querySelector('.gridDiv'); 
var columns = '200px 200px'; 
// TODO - code to compute columns 
gridDiv.style.msGridColumns = columns;