bootstrap-5 - 引导程序 v5 中的媒体类到 Flex（实用程序类）

Question

我刚刚更新到 bootstrap 5，现在面临一些问题。一个是媒体和媒体主体类。我读到这已被 d-flex justify-content-around 取代，但我没有像第 4 版那样将我的两个下拉列表分配给彼此。我还按照示例在In Bootstrap v5.0.0-alpha1 上听什么可以我用于媒体（BS 3/4）？

我在 v4 中的两个组合框如下所示：

<div class="media">
    <div class="media-body">
        <label for="country">Country</label>
        <select class="form-control" name="TableCompany"><option value="">Please select the Country</option>
            <option value="DE">DE</option>
            <option value="NL">NL</option>
        </select>
    </div>
    <div class="media-body">
        <label for="company">Company</label>
        <select class="form-control" name="company"><option value="">Please select the Company</option>
        </select>
    </div>
</div>

我能存档的最好的结果是两个盒子出现在中间，每个盒子都有自己的大小。之前，独立于内容，大小被分割并在两者之间留有边距。

我还注意到，现在我的下拉菜单不再有选择箭头。顺便提一句。这是我的下拉菜单的 asp.net 代码：

@Html.DropDownListFor(model => model.TableCollectionDevice.FirstOrDefault().collection_name,  new SelectList(Model.TableCollectionDevice.Where(x => x.persona == false), "collection_id" , "collection_displayname"), "Please select the Collection",  new {  @class="form-control flex-shrink-0 flex-wrap" })

有人有更好的例子如何从 v4 移植到 v5 吗？

谢谢

标签： bootstrap-5