为什么css边界半径导致元素在这个最小的角材料侧成分中消失?(提供演示)

egdjgwm8  于 2023-05-30  发布在  其他
关注(0)|答案(1)|浏览(98)

这是关于Angular Material Sidenav component。在下面的代码中,当我增加border-radius时,当它与封闭元素重叠时,元素消失。

<mat-drawer-container class="example-container">
  <mat-drawer mode="side" opened>
    Drawer content <br />
  </mat-drawer>
  <mat-drawer-content
    style="
      border-radius: 0px; // <-- try to increase this value to see effect
      display: flex;
      flex-direction: column;
      justify-content: stretch;
      align-items: stretch;
      background-color: rgb(255, 200, 200);
    "
    >Main content</mat-drawer-content>
</mat-drawer-container>
  • (无边框半径时内容可见)*

  • (添加边框半径时内容消失)*

Stackblitz:https://stackblitz.com/edit/7swnhp?file=src%2Fexample%2Fsidenav-drawer-overview-example.html
我看不到元素的位置,看不到任何隐藏样式,在DOM中我可以看到它在那里,但它是不可见的。

t2a7ltrp

t2a7ltrp1#

当我添加border-raduis时,它像预期的那样工作,内容可见。

相关问题