面板外的SVG图像被裁剪

Question

我正在尝试在材料扩展面板的边框上放置一个svg图像。问题在于svg图像应放置在面板的外面一点。

但是svg图像被裁剪。我尝试使用z-index，但没有任何效果。

你有什么想法吗？

错误：

预期：

css

.svg-class .mat-radio-container::after {

  display: block;
  content: url("../../assets/images/top-kondition3.svg");
  overflow: visible !important;
  margin: -31px;
}

html

      <mat-expansion-panel *ngFor="let element of elements" class="svg-class">
          <mat-expansion-panel-header matRipple>
            <mat-radio-button #radio (change)="onChanged($event)"></mat-radio-button>
           Hello
          </mat-expansion-panel-header>

        </mat-expansion-panel>          
    </mat-accordion>

Answer 1

父div中必须设置overflow: hidden，也许是<mat-expansion-panel>的父

因此您需要将overflow:visible分配给父div，然后它才能工作