如何使用fluent-kit将模态框放置在页面右下角？
我来帮你梳理下可能遗漏的关键点，毕竟你已经确认了资源引入正确，那大概率是配置或类名使用的问题：
类名组合方式不对：很多UI组件库的定位类不支持直接叠加两个方向类（比如同时加
modal-right和modal-bottom），而是提供了预定义的复合类名。你可以去fluent-kit的modal定位文档里确认，是否存在类似modal-bottom-right这种组合类，用来直接指定右下角位置。如果有，替换掉你现在的两个单独类试试。缺少JS初始化配置：有些自定义定位的模态框，光靠CSS类是不够的，需要在初始化时通过JS传入定位参数。比如你可以尝试显式初始化模态框，并指定位置配置：
$('#modal-example').modal({ position: 'bottom-right' // 具体值以文档里的配置项为准 });
如果之前只是依赖data-*属性触发模态框，可能不会自动应用双方向的定位样式，显式初始化能确保配置生效。
CSS样式被覆盖：打开浏览器开发者工具，选中
div.modal-dialog元素，查看它的position、right、bottom等样式属性，看看是不是被你自己的自定义CSS或者其他第三方样式覆盖了。如果发现样式被划掉，说明优先级不够，你可以给目标类名增加更高优先级的选择器（比如加上父元素的ID：#modal-example .modal-dialog），或者临时用!important测试是否能生效（不推荐长期使用，仅用于排查）。版本兼容性问题：如果你使用的是旧版本的fluent-kit，可能不支持同时设置水平和垂直方向的定位，或者类名规则和最新文档不一致。可以确认下你使用的版本对应的文档，看看定位类的写法有没有变化。
你可以先从类名组合和JS初始化这两个方向排查，这是这类问题最常见的原因。如果还是不行，通过开发者工具检查样式应用情况，应该能快速定位到问题所在。
内容的提问来源于stack exchange，提问作者wscourge
