1

div の配置に問題があります。テーブルに似たインターフェイスを構築していますが、すべて div で行っており、動的に php で埋められています。

各エントリは、クラスの div に含まれてい.entryます。その div 内には、php からのコンテンツに応じて高さが変化する小さな div の束があります。

.seperator各エントリの間に、エントリを互いに分離する黒いバーであるdiv という名前があります。

自動塗りつぶし.entryの div の後にセパレーターを配置すると、セパレーター バーが div の後ろの上部に浮かびます.entry。なぜこれが起こっているのかわかりません。divに高さが設定されていないためだと思います.entryが、データに基づいて拡張する必要があるため、高さを設定できません。

エントリのサイズを動的に変更しながら、ドキュメント フロー内にとどまり、その下に他の 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 に答える