Html 如何在css中自动调整父框的大小？

如何使“cols_img”框位于下面代码中的“col2”框内？我知道，如果我增加“col2”的填充，它会起作用，但有没有办法自动做到这一点

html{
框大小：边框框；
}
*，*：之前，*：之后{
框大小：继承；
}
.col2{
边框：2件纯黑；
填充物：5px；
}
cols_img先生{
宽度：50%；
浮动：左；
填充：10px 10px 5px 5px；
背景颜色：黄色；
边框：1px纯蓝色；
}

---

一种方法是在

col2

类中使用

：after

.col2:after {
    content: '';
    display: block;
    clear: both;
}

---

可以使用display:inline块而不是float

.cols_img {
  display: inline-block;
  width: 40%;
  padding: 10px 10px 5px 5px;
  background-color: yellow;
  border: 1px solid blue;
}

---

请在此处查看：

您需要清除浮动元素：肯定是重复。用户显示：父级的内联块