Html 正在尝试获取包含内容的父容器的高度 第1部分：

我试图让我的父母div随着内容的高度而增加。它是包含在父div中的幻灯片放映，幻灯片放映是响应性的。一切都很好，但10px的填充并没有反映在主容器周围。有什么帮助吗

示例：

.mainer{
宽度：100%；
背景色：红色；
填充：10px
}
.滑套{
宽度：60%；
身高：继承；
顶部：10px；
边框：0px纯黑；
清除：左；
保证金：0自动；
位置：相对位置；
文本对齐：居中；
}

正在应用父对象上的padding:10px
，但您在
img
上有
top:10px
，它将其向下推10px，并弄乱父对象的底部填充。要增加图像顶部和父对象之间的空间，而不弄乱父对象的底部填充，请使用
填充顶部
或
边距顶部
，而不是
img上的
顶部

要将
.rightbox
放在
.carousel_slider
旁边，请将父
显示为：flex
，它会将这两个子项放在一行的相邻列中


.mainer{
宽度：100%；
背景色：红色；
填充：10px；
}
.滑套{
身高：继承；
边框：0px纯黑；
清除：左；
保证金：0自动；
位置：相对位置；
文本对齐：居中；
填充顶部：10px；
}
.滑套{
显示器：flex；
调整项目：灵活启动；
证明内容：中心；
}
.右框{
宽度：100px；
高度：100px；
}

右盒
您的问题可能与使用clear而不使用clearfix有关。我不完全清楚为什么要清除
clear:left
，实际上，html中没有任何其他浮动元素需要清除。无论如何，当您清除一个元素时，它通常不再占用空间。已清除元素中的项目仍将占用空间，但在没有clearfix的情况下，您无法正常将边距和填充应用于已清除元素。这里有一个你可以很容易地使用


也就是说，clear+clearfix被合理地贬值了，您可能会在其他地方找到更好的结果。试着做一个相对定位的，绝对定位的。把包装纸滑到里面。这将允许您将宽度设置为60%静止，并将其相对于.mainer的顶部和左侧对齐。如果您不使用旧版本的internet explorer，可以查看flexbox。我不打算在这里解释所有flexbox，因为其他的flexbox已经做得更好了，但它允许您智能地将项目与其父容器对齐，并且如果您的元素有兄弟元素，它会特别有用。
@Micheal coker。谢谢你，迈克。我真蠢，img上有填充物。谢谢成功了。但是在第二部分，它也起作用了，但是我试着给正确的框一个宽度和高度，它确实反映了它。取而代之的是，我把右边的div放在幻灯片包装器外面，给mainer一个flex显示，效果不错，但是右边的div浮动得太远了。离地面太远了slider@MichelleDimwaite不客气。re:rightbox，你只是说你想要一个右边的rightbox。如果要指定高度和宽度，请在flex父项上使用
对齐项目
，并将其设置为
拉伸
以外的值，以便更改高度。您可以在上面使用width，但它可能会受到父对象的
width:60%
的限制，这将限制子对象的潜在宽度。我删除了
width:60%
并将
justify content:center
添加到flex父级，以使图像和右框居中。用这些更改更新了我的答案。@Micheal Coker:谢谢。这很有效，迈克。我教的内容类似于文本对齐。干得好，再次感谢……米歇尔