0

我在 bg 顶部有一个白色容器，但即使 min-height 设置为 100%，它也会停止，这是这个容器的 CSS，在底部我包含了当我滚动到底部时发生的情况的图像： Container where post是：黄色背景：

               .home-body {
                background-color:#EAC117;
                height: 100%;

            .home-main-content {
            width:800px;
            min-height: 100%;
            position:absolute;
            overflow:hidden;
            margin-left:56.5%;
            left:-500px;
            top:51px;
            border-left:1px solid black;
            border-right:1px solid black;
            background-color:#fff;
            background-repeat:repeat-y;



            .home-post-echoed-container {
            width:400px;
            position:absolute;
            margin-left:50%;
            left:-200px;
            top:200px;
            overflow:hidden;
            }
            .home-echoed-posts {
            width:600px;
            overflow:hidden;
            left:-98px;
            position:relative;
            background-color:#fff;
            margin-bottom:-5px;
            border-top:1px solid;color:#0a527e;
            border-left:1px solid;color:#0a527e;
            border-right:1px solid;color:#0a527e;
            }
            .home-echoed-posts-post {
            margin:10px;
            color:black;
            }
            .home-echoed-posts-email {
            margin:10px;
            color:black;
            }
            .home-echoed-posts-date {
            margin:10px;
            color:black;
                            }

这是清除 bg 结尾时发生的情况

4

2 回答 2

5

你这样做是不对的。

要使您应该使用的东西居中（而不是绝对定位）：

.foobar{
   margin: 0 auto;
   width: 800px;
}

至于“为什么评论没有扩展容器”，没有代码很难猜到，但有两种合理的可能性：定位或浮动。我对此无能为力。但是如果它们是浮动的，那么很容易拥有具有以下 css 的容器：

.container{
   overflow: hidden;
}

这有点违反直觉，但就像魅力一样。你可以在这里阅读更多关于它的信息。

更新：也阅读这篇文章。

更新 2：

看起来这是麦芽汁的情况。您正在使用定位 .. 来处理一切。你真的需要学习如何使用浮点数。

.home-post-echoed-container {
    width: 600px;
    margin: 0 auto;
    padding-top: 200px; // im guessing what top:200px was doing
    overflow:hidden;
}
.home-echoed-posts {
    width:600px;
    float: left;
    background: #fff;
    margin-bottom: -5px;
    border: 1px solid #0a527e;
    border-bottom: 0;
}

像这样的东西。但我真的只是猜测。

于 2012-06-17T00:34:49.633 回答
1 
html, body 
{
    height:100%;
}

确保将其包含在 CSS 脚本的顶部，否则设置.home-main-content为min-height:100%;不起作用，因为对于 CSS，如果在其他地方未定义，100%则只是当前 div 的高度。

.home-main-content如果您被另一个 div 包围，还要确保您具有相同的属性集。

于 2012-06-17T00:33:33.673 回答