BFC 的一个疑问

BFC 有一个特性:BFC容器里面的子元素不会影响到外面的元素,反之亦然;

然而如下图,蓝色盒子为左浮动,橘色盒子没有浮动。蓝色盒子影响了橘色盒子,遮盖了橘色盒子,还使得橘色盒子的内容向右挪了100px。与上述特性描述不符,为什么呢,我是不是理解错了?

图片描述

代码:

<style>
  body {
    width: 300px;
  }
  .aside {
    width: 100px;
    height: 150px;
    float: left;
    background: blue;
  }
  .main {
    height: 200px;
    background: orange;
  }
</style>
<body>
  <div class="aside">左浮动</div>
  <div class="main">没浮动</div>
</body>
阅读 1.4k
1 个回答

BFC容器里面的子元素不会影响到此容器外面的元素

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题