Css Column Flex，子iframe 100%高度，显示父卷轴

在div have height 100%iframe中，父级显示为Y滚动。为什么会溢出

.root{
位置：绝对位置；
身高：100%；
宽度：100%
}
iframe{
指针事件：全部；
宽度：100%；
身高：100%；
边界：0；
溢出y：隐藏！重要；
溢出-x：隐藏！重要；
溢出：隐藏；
}

头

添加到属性到根类。也就是说，

overflow-y:hidden

.root{
  overflow-y: hidden;
}

HTML中的更改

<div class="d-flex flex-column root">
  <div style="background:yellow">
  Head
  </div>
  <div class="h-100">
    <iframe frameborder="0" allowfullscreen src="https://www.portotheme.com/"></iframe>
  </div>
</div>


头