CSS display none删除元素,但保留其占用的空间

在我的图表中,我想根据条件删除一些图例项,我正在使用CSS,display none,从JS控制器中删除。移除效果很好,但是,元素占用的空间会留下空白。为什么?

由于这个HTML是动态生成的,所以我从前端展示了一个屏幕截图,其中显示:none突出显示。我试图在浏览器中编辑标签,使用CSS,但没有任何帮助。空白处仍然是静止的。

chart: {
    //.....................................

    callback: function (chart) {


         var legendItems = document.getElementsByClassName('nv-series');

         for (var x = 0; x < legendItems.length; x++) {
                                                
             var legendItem = legendItems[x];
             var content = legendItem.textContent.trim();

             if (content.indexOf('Item 3') !== -1 || content.indexOf('Item 7') !== -1) {
                                 
                 legendItem.style.display = 'none';

              }
          }

     }
}