物料垂直分隔线未显示

Question

我编写了一个非常简单的程序，因为我想尝试由角形材料提供的垂直分隔线，但是由于某种原因，它没有显示出来。 我的代码是：

<div>
  <span>code</span>
</div>
<mat-divider [vertical]="true"></mat-divider>
<div>
  <span>2</span>
</div>

Answer 1

尝试为垂直分隔线增加高度。

<mat-divider vertical style="height:100px"></mat-divider>

Stackblitz

https://stackblitz.com/edit/angular-wp9f4j?embed=1&file=app/divider-overview-example.html

Answer 2

尝试将以下类添加到.css

.mat-divider-vertical{
  height: 100%;
  width: 0px !important;
  position: inherit !important;
}

并设置 style =“ position：relative;” 外部元素以使“ 100％”起作用。