gap在小容器中会被压缩甚至归零，因浏览器按CSSGrid规范强制缩减gap以适配可用空间；最大允许总gap=容器内宽－列数×单列基准宽。

Grid布局仅作用于直系子元素，浮动元素脱离文档流导致Grid失效；需清除所有float声明、删除冗余clear和margin、将Grid应用到实际列容器，并统一box-sizing。

sticky元素卡住不动，根本原因是其非static定位的父容器高度为0，导致top/bottom无参考；常见于父元素内容为空、未设height/min-height，或flex/grid布局中高度塌陷。

响应式flex布局需结合flex-basis与媒体查询断点：平板设flex:00calc(50%-1rem)，手机设flex:00100%，而非仅依赖flex-wrap。

相对定位偏移在不同屏幕下错位，是因为其原始位置随响应式变化而改变，但固定像素偏移值未同步调整；应优先用flex/grid布局替代，必要时用媒体查询微调或transform替代top/left。

浮动导致父容器高度塌陷因父容器忽略浮动子元素高度；解决方法依次为：overflow:hidden触发BFC、display:flow-root（现代首选）、伪元素::after清除；clear:both须作用于浮动后的兄弟元素而非父容器；Flex/Grid布局下float失效，无需清除。