将桌子与顶部对齐-有角度的桌子和垫子卡

Question

我正在尝试将两个表对齐到顶部。没有成功-请参阅所附的屏幕截图。

不均匀表格

我尝试在所有可能的级别上使用垂直对齐，但没有成功。

我们非常感谢所有的想法。

我的HTML代码如下：

<div fxLayout="row" fxLayoutAlign="space-between center" fxLayoutGap="20px">
<div fxFlex="50">
<mat-card style="box-shadow: none;">
...
<mat-card-content>
<div class="mat-elevation-z8" style="vertical-align: top;">
<table mat-table [dataSource]="dataCurrentAssets" style="width:100%; vertical-align: top;">
...
</table>
</div>
</mat-card-content>
</mat-card> 
</div>
<div fxFlex="50" style="vertical-align: top;">
<mat-card style="box-shadow: none;vertical-align: top;">
...
<mat-card-content style="vertical-align: top;">
<div class="mat-elevation-z8" style="vertical-align: top;">
<table mat-table [dataSource]="dataCurrentLiabilities" style="width:100%;vertical-align: top;">
...
</table>
</div>
</mat-card-content>
</mat-card> 
</div>
</div>

Answer 1

尝试使用start的fxLayoutAlign

<div fxLayout="row" fxLayoutAlign="space-around start" >

参见布局演示

Answer 2

此问题由您提供。将"center"替换为"start"。请使用下面的行(这是代码中的第一行(。以下是所需的更改：

<div fxLayout="row" fxLayoutAlign="space-between start" fxLayoutGap="20px">