子盒子加外边距,父盒子跟着移动的解决方法

2022-02-18  本文已影响0人  键盘已附魔

做项目的时候在最大的div里嵌套了一个小的div,给小的div设置margin的时候,大盒子一起掉下来,然后百度找问题,找到了
给子元素盒子增加垂直外边距margin-top时,会导致父元素盒子与子元素盒子边界重叠而导致父元素盒子也往下走
解决办法:
1、修改父元素的高度,也就是时设置父元素盒子的内边距,增加padding-top样式模拟(padding-top:1px;常用)

2、为父元素添加边框线border(border:1px solid transparent可用)

3、为父元素添加溢出隐藏属性overflow:hidden;样式即可(完美)

4、为父元素或者子元素声明浮动(float:left;可用)

5、为父元素或者子元素声明绝对定位(position:absolute;)

转载自https://blog.csdn.net/oiu1010110/article/details/53192048

上一篇下一篇

猜你喜欢

热点阅读