max-width + margin: 0 auto 是实现块级容器水平居中的最直接有效组合，需作用于独立块级元素（如），配合box-sizing: border-box防止溢出。
max-width + margin: 0 auto 是最直接有效的组合
只写 max-width: 1200px 不会居中，它只限制“最多能多宽”，不控制位置。浏览器默认块级元素左对齐，所以必须配 margin: 0 auto 才能均分左右空白、实现水平居中。
- 必须作用在块级容器上（如
<div>、<code><main></main>），不能直接写在上——部分浏览器会给默认margin，导致偏移 - 推荐加
box-sizing: border-box，否则padding或border会撑出max-width限制 - 百分比值（如
max-width: 90%）基于父容器宽度计算，不是视口；固定值（如max-width: 1440px）更可控，适合桌面端主内容区 -
container-fluid是 100% 宽，没有最大宽度限制，别和container混用 - 不同 Bootstrap 版本的断点宽度不同（如 v5+ 中
xl是1140px），别硬记，直接 inspect 元素看 computed style 更准 - 真正生效的组合是：
table-layout: fixed+<colgroup></colgroup>+ 显式列宽定义 -
<colgroup></colgroup>必须放在<table> 开始后、<code><thead> 前，顺序错了就无效 <li> <code><col style="width: 200px">比<th width="200"> 更可靠；现代浏览器支持 <code>width: 1fr实现弹性分配，但旧版需退化为width: auto配合min-width/max-width小屏下横向滚动条出现？检查 padding 和 box-sizing
写了
max-width: 1200px却在手机上出现横向滚动条，大概率是容器内有未重置的padding或border，加上box-sizing: content-box（默认值）导致总宽度溢出。- 务必加
box-sizing: border-box，让padding和border包含在max-width内 - 如果用了
rem或em单位的padding，注意根字体大小变化可能放大实际尺寸 - 避免在容器上同时设
width和max-width，尤其当width是百分比时，容易触发意外撑满
<div> 有没有浮动、是否被 flex/grid 父级干扰了 <code>margin: 0 auto行为，还有表格这种特殊元素根本不在常规居中逻辑里。 - 务必加
别把 container 类错用在 body 上
Bootstrap 的 container 是类名，不是语义标签，它依赖具体 CSS 规则匹配结构。 完全无效，因为它的样式只对 .container > * 或作为独立块级容器的 <div class="container"> 生效。
<ul><li>正确用法：用 <code><div class="container"> 包住 <code><main></main> 或正文区域，<header></header> 和 <nav></nav> 可以全宽，不受限
table 元素里 max-width 失效？问题出在 table-layout
给 <table> 直接写 <code>style="max-width: 800px" 常常没反应，文字照常撑开整行。这不是 bug，是表格默认 table-layout: auto 的行为：列宽由内容决定，max-width 只约束整体容器，不干预内部单元格。
