css – 使子对象在overflow：hidden parent之外可见

在CSS中，overflow：hidden设置在父容器上，以便允许它扩展其浮动子项的高度。

但它也有另一个有趣的功能，当与margin：auto …

如果PREVIoUS兄弟是一个浮动元素，它实际上会出现并列。也就是说，如果兄弟是float：left，那么带有float：none的容器overflow：hidden会出现在兄弟的右边，没有换行符 – 就像是在正常流中漂浮一样。如果前面的兄弟是float：right，那么容器将出现在兄弟的左边。调整此容器的大小将准确地显示它居中在浮动元素之间。说如果你有两个以前的兄弟姐妹，一个浮动：离开另一个浮动：右，容器将出现在两者之间的中心。

所以这里的问题…

How do I maintain that type of layout WITHOUT masking children?

Googling在网络上给了我如何清除：两个和展开一个容器…但我找不到任何替代解决方案维持左/右前儿童中心。如果使容器溢出：可见，则容器突然忽略浮动元素的布局流，并且在浮动元素的顶部出现分层。

所以问题：

我必须有容器溢出：隐藏以保留布局…

我怎么能使它使孩子们不被掩盖？我需要让孩子绝对相对于容器外的父类。

要么

如何溢出：可见，所以我可以绝对定位一个孩子相对于父容器外的父… YET保留兄弟的float-like-layout-flow？

解决方法

你可以使用clearfix做“布局保留”同样的方式overflow：hidden。

.clearfix:before,.clearfix:after {
    content: ".";    
    display: block;    
    height: 0;    
    overflow: hidden; 
}
.clearfix:after { clear: both; }
.clearfix { zoom: 1; } /* IE < 8 */

添加class =“clearfix”类给父，并删除overflow：hidden;

原文链接：https://www.f2er.com/css/223178.html

css – 使子对象在overflow：hidden parent之外可见

解决方法

猜你在找的CSS相关文章