我试图并排放置两个网格，但第二个网格会自动移到下一行.
我已将每个网格的宽度减少到 40%，并且还尝试将网格放置在 中，但我仍然无法显示彼此并排的网格.
使用 flexbox 应该可以解决您的问题:
.row {显示:弹性；}.柱子 {弹性:50%；填充:10px；高度:500px；}<div class="row"><div class="column"><ag-grid-angular [gridOptions]="firstGrid" class="ag-theme-balham"></ag-grid-angular><div class="column"><ag-grid-angular [gridOptions]="secondGrid" class="ag-theme-balham"></ag-grid-angular>
I am trying to place two grids side by side ,but the second grid is automatically shifted to the next line.
I have reduced the width of the grids to 40% each ,and also tried to place the grids in <span> ,But still I am not able to display the grids beside each other.
Using flexbox should solve your problem:
.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>
这篇关于如何使用 Angular 6 -Ag 网格并排显示两个网格的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持！