Question

<html>
<head>
<style>
  div{
     border: 1px solid black;
     float: left;
  }

  p{
      border: 1px solid black;
      float: left;
  }
</style>
</head>
<body>
    <div>
     text
     <p>text</p>

    </div>
</body>

</html>

这是我的代码，为什么div的宽度变得更大，而div内的'text'似乎偏离它的原始空间。我希望div的宽度是'text'的宽度。 为什么会发生这种情况？

Answer 1

<div class="A">
  size
  <div class="B">
      will
      <div class="C">
          be increased
      </div>
  </div>
</div>

当你在另一个标签（如div，p）中添加一些标签时，所有标签都有（float：left）样式属性，外标签宽度将增加内标签宽度。

但它们将垂直显示，因为高度不固定..而且div的宽度将保持增加的大小

Answer 2

删除float: left;

的p

问候。

当float元素嵌套在css中的另一个float元素内时，为什么祖先元素的宽度会变大？

2 个答案: