twitter-bootstrap - 不同屏幕尺寸中的不同列放置 Bootstrap 5

Question

在我的带有 Bootstrap 5 的 Angular 应用程序中，有一个像这样的标记

                <div class="row details-row" *ngIf="closureDetails">
                  <div class="col-lg-6 col-xs-12">
                    <app-milestone></app-milestone>
                  </div>
                  <div class="col-lg-6 col-xs-12">
                    <app-risk></app-risk>
                  </div>
                  <div class="w-100"></div>
                  <div class="col-lg-6 col-xs-12">
                    <app-ar2></app-ar2>

                  </div>
                  <div class="col-lg-6 col-xs-12">
                    <app-financials></app-financials>
                  </div>
               </div>

我期待它在一个大或更高的视口中，w-100 之前的两列将显示为像这样连续的一半

在xs或更高版本中它应该像这样工作

但它没有像我预期的那样工作。在所有分辨率中（我尝试调整窗口大小），两列都显示在同一行而不是两行。

那么我的课出了什么问题呢？

标签： twitter-bootstrapbootstrap-5