如何使用Angular 6 -Ag网格并排显示两个网格

Question

我试图并排放置两个网格，但是第二个网格会自动移到下一行。

我已将每个网格的宽度减小到40％，并尝试将这些网格放置在<span>中，但仍然无法将网格彼此并排显示。

Answer 1

使用flexbox应该可以解决您的问题：

.row {
  display: flex;
}

.column {
  flex: 50%;
  padding: 10px;
  height: 500px;
}

<div class="row">
  <div class="column">
    <ag-grid-angular [gridOptions]="firstGrid" class="ag-theme-balham"></ag-grid-angular>
  </div>
  <div class="column">
    <ag-grid-angular [gridOptions]="secondGrid" class="ag-theme-balham"></ag-grid-angular>
  </div>
</div>