7-4圣杯布局当视口小于900像素时显示异常
来源：7-3 圣杯布局的解决方案
慕婉清3746980
2019-11-27 22:36
能确认一下吗
写回答
关注
2回答
-
- ccyy_阿亮
- 2020-11-19 20:42:39
把左右盒子的“margin-left: -100%”或者“margin-right: -100%”中的百分比改为“-300px”，也就是左右盒子的宽度，左盒子的相对定位也要相应调整，右盒子如果有使用相对定位也要调整（其实右盒子直接margin-right:-300px）。
原因就是它的100%是相对于父级元素的，视窗小于900，左右固定和是600，那parent就小于300px，使用“-100%”让左右盒子跳不到上一行了，它需要达到-300才能跳到上一行。
-
- SlashYouth
- 2019-12-01 12:01:20
个人觉得是因为固定了左右盒子的宽度，没有采用自适应，所以不是所有分辨率都兼容。
一课全面掌握主流CSS布局
一网打尽CSS主流布局方案，一步掌握页面布局技巧.
5276 学习 · 60 问题
相似问题