3

我正在编辑一个 Wordpress 主题的 CSS(二十)

这是我的 HTML 结构:

<body>
    <div id="wrapper">
        <div id="header"></div>
        <div id="main">
            <div id="filtri_di_ricerca"><img></div>
            <div id="container">
                <div id="content"></div>
            </div>
        </div>
        <div id="footer"></div>
    </div>
</body>

这是我的CSS:

#main {
    position:relative;
    background:#fff;
    overflow:visible;
}

#filtri_di_ricerca img {
    position: absolute;
    top: -96px
}

#filtri_di_ricerca {
    position: absolute;
    top: 0;
    right: 20px;
    width: 250px;
    background-color: #E6E6E6;
}

我需要将#maindiv 与#filtri_di_ricercadiv 重叠,但是当我设置折叠为零overflow:visible#main his height......我仍然可以看到#container#content但背景#main不再可见......我看到#body的是背景。

4

3 回答 3

2

这是由如何计算 div 的高度引起的。这一切都取决于内容,如果没有设置固定。由于溢出:可见,内容不需要适合 div。所以div的高度设置为零。

为 div 设置一些固定的高度,它应该保持在那个高度。

于 2013-03-25T17:10:48.347 回答
1

您需要清除 #main div 的浮动。

/* For modern browsers */
#main:before,
#main:after {
    content:"";
    display:table;
}
#main:after {
    clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
#main {
    zoom:1;
}

阅读有关 clearfix 的更多信息

于 2013-03-25T17:22:47.623 回答
0

#filtri_di_ricerca 的 CSS 位置是“绝对的”(所以要脱离自然流),而 #container 没有任何内容。

尝试在#content 中添加一些内容并设置#content 的padding-top 等于#filtri_di_ricerca 的高度

于 2013-03-25T17:17:47.487 回答