如果父元素有设置了padding、border或outline,这些属性会影响margin的计算,可能会导致margin-top无效。 特定场景下的处理: 兄弟元素之间的margin-top失效:如果两个元素是兄弟关系,且一个元素浮动而另一个没有,那么未浮动的元素的margin-top可能无效。解决方法是给未浮动的元素也添加float属性,或者在它们之间添加一个清...
在这种情况下,margin-top也可能会被忽略,可以尝试将overflow属性设置为visible。 父元素有设置了padding、border或outline。这些属性会影响margin的计算,可能会导致margin-top无效。 元素的position属性为absolute、fixed或sticky。在这种情况下,margin-top可能会失效,可以尝试改变元素的position属性或者使用top属性来调整元素的...
margin top 无效 常出现两种情况: (一)margin-top失效 两个层box1和box2,box1具有浮动属性,box2没有,这时候设置box2的上边距margin-top没有效果。 解决办法: 1.box2增加float属性 2.box1与box2之间增加一层"" (二)子元素设置margin-top作用于父容器 当给box2设置margin-top时,在FF下仅作用于父容器。 ...
原因:根据W3C盒子模型的规范,一个盒子如果没有上补白(padding-top)和上边框(border-top),那么这个盒子的上边距会和其内部文档流中的第一个子元素的上边距重叠。 解决该问题的办法: 1.在父元素加上有意义的border数值(0,none无效) 2.用内边距来解决(给其父元素一个设置个内边距) 3.在父级元素加: float:l...
在web网站开发中,有时候我们给html元素设置的margin-top或margin-bottom属性,但是无效,并没有取到任何作用,这是什么原因呢?常出现两种情况: 1、兄弟元素之间margin-top失效 先看下面代码: float: left clear:both; margin-top:20px; 1. 2. 两个层box1和box2,box1具有浮动属性,box2没有,这时候设置...
1、兄弟元素之间margin-top失效 先看下面代码: float: leftclear:both; margin-top:20px; 两个层box1和box2,box1具有浮动属性,box2没有,这时候设置box2的上边距margin-top没有效果。 网上能找到的两种比较靠谱的解释: 1):“在css2.1中,水平的margin不会被...
1、兄弟元素之间margin-top失效 先看下面代码: float:leftclear:both;margin-top:20px; 两个层box1和box2,box1具有浮动属性,box2没有,这时候设置box2的上边距margin-top没有效果。 网上能找到的两种比较靠谱的解释: 1):“在css2.1中,水平的margin不会被...
1、兄弟元素之间margin-top失效 先看下面代码: float: left clear:both; margin-top:20px; 两个层box1和box2,box1具有浮动属性,box2没有,这时候设置box2的上边距margin-top没有效果。网上能找到的两种比较靠谱的解释: 1):“在css2.1中,水平的margin不会被折叠;垂直margin可能在一些盒模型中被...
1.针对类名margin-top的margin-top值无效的问题,需要给父div加一个border 2.针对margin值叠压,可以给任意一个子div的一侧方向值设置为80px,浏览器会选择最大的margin展示页面 修正后的效果: image.png 修改后的css: .margin-wrap{width:800px;height:600px;margin:0 auto;border:1px solid #ccc;background-co...
当个子元素设置margin-top属性时,如何父元素没有设置padding属性,即padding属性为0,那么会出现以上这个情况。 解决办法:这里有四种解决办法 给父元素加上css样式:overflow:hidden 给父元素加上css样式:padding-top,其值只要不是0都可以 给父元素加上css样式:position: absolute ...