“数据丢失”是一个有趣的术语。我的大脑将其理解为从服务器到浏览器的传输过程中数据包丢失，导致文件中的内容缺失。也许在某种程度上确实如此，但在 CSS 用语中，它与 overflow 属性有关。对于大小固定的容器，内容过多 + 隐藏溢出 = 数据丢失。
但并非只有溢出会导致这种“数据丢失”。对齐方式也会导致数据丢失。想象一下 flexbox 或 grid，其中某些对齐方式会导致内容被推到屏幕顶部或左侧边缘，而滚动条无法到达这些区域。
为了防止对齐方式导致意外的数据丢失，CSS 现在提供了一些新的关键字，可以与对齐方式属性一起使用。这些关键字在 Box Alignment 规范中指定——该规范处理所有布局方法（包括 Grid 和 Flexbox）的对齐方式。目前，只有 Firefox 支持这些关键字。在上面的示例中，如果我们将
align-items: safe center设置为，则最后一个项目将对齐到start而不是强制内容居中。这将防止由于项目居中而被推到视口边缘而导致的数据丢失。