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

flex等宽应设flex:110且min-width:0；grid三列等宽用repeat(3,1fr)，并加overflow-wrap:break-word防撑开。

justify-items和align-items控制子项在单元格内的行内轴（水平）和块轴（垂直）对齐，默认stretch；justify-content和align-content对齐整个网格轨道，仅在轨道未填满容器时生效；justify-self和align-self可覆盖单个子项对齐。

:checked+div不生效最常见原因是HTML结构不满足相邻兄弟选择器要求：input与div必须同父、紧邻，中间不能有空白或注释；解决方法是删除空白或改用Flex/Grid布局配合display控制。

浮动导致父容器高度塌陷，overflow:hidden可触发BFC临时解决但有裁剪等副作用；推荐用clearfix伪元素清除或现代display:flow-root，新项目应优先采用Flex/Grid布局。

grid-template-areas是CSS中用于通过字符串网格图定义命名区域的布局属性，本质是声明式布局而非语法糖；它提升可读性、语义化和协作效率，支持用“.”表示空白，并需严格匹配子元素的grid-area值。