1

我对 div 定位有疑问。我正在构建一个有点类似于表格的界面，但我正在使用 div 来完成这一切，并且它是用 php 动态填充的。

每个条目都包含在一个带有 class 的 div 中.entry。在那个 div 中有一堆较小的 div，它们的高度取决于 php 的内容。

在每个条目之间，我有一个 div 调用.seperator，它是一个将条目彼此分隔开的黑条。

当我在自动填充.entry的 div 之后放置分隔符时，分隔条会浮到.entrydiv 后面的顶部。我不确定为什么会这样。我猜这是因为.entrydiv 上没有设置高度，但我无法设置高度，因为我需要它根据数据进行扩展。

那么如何让条目动态调整大小但仍保留在文档流中，以便我可以继续将其他 div 放在它下面？

.entry{
    width:100%;
    font-size:12px;
}
#seperator{
    height:10px;
    width:100%; 
    background-color:black;
}

并且这两个都嵌套在我的主容器中

#mainContainer{
    border-left-style:solid;
    border-right-style:solid;
    border-width:2px;
    background-color:white;
    width:1000px;
    height:100%;
    margin:0px auto;
}

所以，如果我在条目上设置了一个高度，那么我的分隔符就在我想要的位置。我猜我的主要问题是我不知道条目的高度，因为它们是动态生成的。

4

1 回答 1

0

如果没有看到实际的 HTML 代码，很难说出发生了什么，但我会说你的问题是条目的内容是浮动的，然后条目没有扩展以包含它们。

尝试使用这个：

.entry{

    overflow: hidden;

    width:100%;
    font-size:12px;
}

隐藏溢出会强制条目扩展到其内部元素的大小，即使它们是浮动的。

于 2012-09-10T18:03:31.183 回答