Boloop 阅读示意图（AI 生成）：断点与弹层边界需要服从实际内容宽度。
Boloop 的页头在 719px 视口下，把整页宽度撑到了 818px。语言切换按钮的右边缘也落在屏幕之外，而用于展开移动导航的按钮还没有出现。
这里并不需要重新设计网站。真正要回答的是：导航内容从多宽开始放不下，弹出菜单是否遵守了它声称的对齐规则，以及修复以后原来的主题和键盘操作是否还正常。
断点应该服从内容能否放下
原布局直到 650px 才折叠桌面导航，但它在比这个宽度更大的屏幕里已经装不下所有内容。719px 这个样本，恰好落在“桌面导航已不适用、折叠规则却未启动”的区间。
这次将共享导航的折叠范围调整到 1050px 及以下，超过这个宽度再显示完整导航。1050px 来自 Boloop 当前页头的内容与布局，并不是适用于所有网站的固定平板断点。
折叠也不等于删掉操作。Home、搜索、语言切换、主题切换和键盘访问需要保留；其他针对小屏正文的 650px 样式则继续使用。只修共享页头，才能把变更范围控制在真正发生问题的位置。
关着正常的菜单打开后也可能越界
调整导航之后，语言弹层又暴露出另一个问题。组件实际渲染的是 select-menu-end，CSS 却在匹配 select-menu-align-end。看起来存在“靠右对齐”的样式，浏览器实际使用的节点却匹配不到它。
在修复前的观察里，390px 视口下弹层右边缘达到 411px，719px 视口下达到 722px。导航容器已经不溢出，并不能替弹出层证明边界正确。
旧回归只检查样式文件里是否存在某段字符串，因此也能通过。修正后，检查对象改成实际渲染的列表框与真正匹配它的选择器；再打开页面，量弹层的实际边界。
这是一个很小却值得记住的区别：测试里有 CSS，不代表页面上有节点在使用它。
默认暗黑也要照顾已经选过浅色的人
同一轮调整中，Boloop 明确了首次访问默认暗黑，同时保留读者已保存的浅色或深色选择。
这要求 HTML 头部的主题启动逻辑与 React 初始化一致。若它们各用一套默认值，页面可能先显示一个主题，加载后又切到另一个；若过早把默认值写回存储，还可能覆盖已有的浅色偏好。
这次让服务端与客户端初始标记一致，在初始化准备好后再读取、持久化偏好。浏览器存储被拒绝时，主题按钮仍可操作。检验默认值时也要使用一个此前没有保存偏好的新来源；在一个已经选过浅色的浏览器里打开页面，继续显示浅色恰好是正确行为。
验收不只缩到手机宽度看一眼
本地检查覆盖英文、简体中文、繁体中文，首页、文章目录与原创指南，以及 390、719、1024、1440px 下的明暗主题，共 72 组布局组合。随后还检查断点附近的宽度，确认 1050px 折叠、1051px 展开，并检查更窄的入口。
实际操作包括展开导航、跳到文章目录、用 Escape 关闭菜单、用键盘打开语言列表、切换语言，并确认主题与焦点恢复。可见页头控件还检查了至少 44×44px 的目标尺寸。只看静态截图，会漏掉其中大部分状态。
获准发布后，正式站又执行了三语言、布局、弹层和主题持久化检查。2026 年 10 月 21 日这次发布的 918 项发布测试通过；线上检查没有观察到页头越界或浏览器控制台错误。它覆盖的是这些页面家族的共享页头，不等于每个页面、每台真机都已测试。
页面里其他的挤压问题也要量实际尺寸
此前文章目录也出现过类似的“看着像响应式问题”的故障：统计栏设置了 flex-basis: 100%，卡片却是不换行的横向 flex，最终把正文容器压到了 0px。
那次修复将文字型文章卡片改回正常块流，让统计信息排在正文之后。它不需要删除统计，也不需要给标题写一串更小的字号。
这两次经历让我在改样式前先量三件事：视口多宽，容器实际多宽，哪一个子元素首先越界。定位到负责分配空间的规则后，修复通常比重新排一遍整页更明确，也更容易保护已有的动画、文字选择和内容层级。