我尝试在modal弹出窗口中使用bootstrap-5网格系统。为了进行测试，我简单地从https://getbootstrap.com/docs/5.0/components/modal/中提取了主模态示例，并在modal-body中添加了网格示例：
<div class="modal-body">
<div class="container-fluid">
<div class="row">
<div class="col-md-4">.col-md-4</div>
<div class="col-md-4 ms-auto">.col-md-4 .ms-auto</div>
</div>
....结果：网格没有得到任何尊重。但为什么呢？
https://jsfiddle.net/3041fLwk/
2条答案
按热度按时间vyswwuz21#
问题是bootstrap没有在modal上实现responsive。它依赖于
media查询的父窗口。如果你创建一个有限宽度的小框，也是一样。要在modal上实现responsive，需要使用
iframe，或者自己在modal上设置断点nr7wwzry2#
我认为您的问题来自于您对
ms-auto的使用-当我删除所有的ms-auto类时，网格按预期工作。