html - 如何删除html div元素之间的间距？

Question

我正在开发 8th Wall Web 应用程序，但这更像是一个 CSS 问题。所以我让这些 html 元素出现在我的屏幕上，它们的样式是 z-index: 10(这是 html 元素通过 8th wall web 出现的 css 要求)。这些元素是这样的:

/*the css for box-* are like so:*/
.box-*{
    background-color: red; 
    transform: rotate(-70deg);
    width: 60%;
    height: 20%;
   }
    #scrolling-container{
       z-index: 10;
       position: absolute;
       display: flex;
       top: 38%;
   }
    
    #button-collections{
       display: flex;
       flex-direction: row;
       overflow: hidden;
       height: 200px;
       padding-top: 120px;
   }

 <div id="scrolling-container">
          <div id="button-collections">
              <div id="box-all"><img id="all-button" src="buttons/btn-all.png"></div>
              <div id="box-seremban"><img id="btn-seremban" src="buttons/btn-seremban.png"></div>
       </div>
    </div>

但由于旋转，结果看起来像这张图片 https://imgur.com/OdBbwuK .我如何摆脱元素之间的空间？

Answer 1

移除 scrolling_container 中的 top:38%; 元素并移除 #button_collection 中的 padding_top:120px; 元素