V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
PeakFish
V2EX  ›  前端开发

web 前端来看看这个例子,浏览器这是什么情况。

  •  
  •   PeakFish · 2021 年 2 月 25 日 · 1258 次点击
    这是一个创建于 1783 天前的主题,其中的信息可能已经有所发展或是发生改变。

    里面这个元素的 margin 负值为啥不生效?

    例子在 codepen,https://codepen.io/PeakFish/pen/GRNyOrd

    cxe2v
        1
    cxe2v  
       2021 年 2 月 25 日   ❤️ 1
    搜索 margin 重叠问题,有你这个问题的答案,还想要深入就去看看 CSS 的 BFC
    PeakFish
        2
    PeakFish  
    OP
       2021 年 2 月 25 日
    @cxe2v 层叠问题得至少涉及到两个元素有 margin 吧,这个就一个元素有 margin
    akaxiaok339
        3
    akaxiaok339  
       2021 年 2 月 25 日
    生效了啊
    PeakFish
        4
    PeakFish  
    OP
       2021 年 2 月 25 日
    @akaxiaok339 chrome 最新版?
    akaxiaok339
        5
    akaxiaok339  
       2021 年 2 月 25 日   ❤️ 1
    现在 inner 的负 margin 你设置到 div2 效果一样,就是 margin 重叠,加上 border 重叠就消失了
    https://developer.mozilla.org/zh-CN/docs/Web/CSS/CSS_Box_Model/Mastering_margin_collapsing
    PeakFish
        6
    PeakFish  
    OP
       2021 年 2 月 25 日
    @akaxiaok339 感谢,那看来 @cxe2v 大佬是正解了
    关于   ·   帮助文档   ·   自助推广系统   ·   博客   ·   API   ·   FAQ   ·   Solana   ·   3825 人在线   最高记录 6679   ·     Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 · 27ms · UTC 00:53 · PVG 08:53 · LAX 16:53 · JFK 19:53
    ♥ Do have faith in what you're doing.