.row-nowrap 不起作用，因为它是非官方类名，bootstrap 4/5 中不存在；应使用官方 .flex-nowrap 类，并配合 .col-auto 或固定宽度控制列布局。
bootstrap 4+ 的 .row 默认是 flex 容器，但 .row-nowrap 并不是 bootstrap 原生类 —— 它不会生效，也不会报错，只是被忽略。
为什么 .row-nowrap 不起作用
Bootstrap 4/5 的栅格系统基于 Flexbox，.row 默认使用 flex-wrap: wrap。想禁用换行，得用官方支持的 .flex-nowrap 类，而不是自造的 .row-nowrap（后者在任何 Bootstrap 版本中都不存在）。
-
.row本身只是个带display: flex和负 margin 的容器，不自带flex-wrap覆盖能力 - 直接写
class="row row-nowrap"，浏览器会把row-nowrap当作无样式 class，完全无效 - 即使你手动加 CSS：
.row-nowrap { flex-wrap: nowrap; }，也容易被其他规则覆盖，尤其在响应式断点下失效
正确做法：用 .flex-nowrap + 手动控制列宽
Bootstrap 4+ 提供了语义清晰的工具类：.flex-nowrap 是标准方案，必须配合明确宽度控制，否则内容会溢出或挤压。
- 只加
.flex-nowrap不够 ——.col-4这类类名仍按 12 分栏逻辑计算宽度（如col-4= 33.333%），超出父容器就横向滚动或溢出 - 推荐组合：
<div class="row flex-nowrap"> <div class="col-auto">A</div> <div class="col-auto">B</div> </div>，让子列“自适应内容宽度” - 若需等宽固定列，改用
style="flex: 0 0 200px"或自定义 CSS 类，避开.col-*的百分比逻辑
小屏幕下强制不换行的陷阱
在 xs 断点（.flex-nowrap 很危险：窄屏空间有限，内容大概率溢出容器，触发横向滚动条，或压垮布局。
- 不要全局加
.flex-nowrap，应结合响应式类，例如：flex-nowrap flex-md-wrap—— xs 强制不换行，md+ 恢复自动换行 -
.col-xs-*在 Bootstrap 4+ 已废弃，改用.col-*（它默认覆盖所有断点），若需仅在小屏生效，得用.col-12.col-md-auto这类组合 - 注意父容器是否设置了
overflow-x: hidden—— 它会隐藏滚动条但不解决内容被截断的问题
表格内嵌栅格时的特别处理
在 <table> 或 <code>bootstrap-table 中混用栅格，.flex-nowrap 极易失效，因为表格单元格（<td>）默认是 <code>display: table-cell，会忽略 flex 指令。
- 正确路径：不在
<td> 内套 <code>.row，改用内联样式或工具类直接控制单元格内容，例如：style="white-space: nowrap; overflow: hidden; text-overflow: ellipsis;" - 如果非要用栅格，必须把
<td> 设为 <code>display: block，但这会破坏表格语义和对齐，不推荐 - Bootstrap Table 的
cellStyle配置（如OptLog.initColumn中所见）才是安全可控的方式
真正难的不是加个类，而是判断「这里到底该不该禁止换行」——多数时候，用户要的不是“强制不换行”，而是“内容可读、不撑破布局”。留出一点 padding，用 text-overflow: ellipsis，比硬塞 .flex-nowrap 更可靠。
