1

次のようなcssの問題があります。

height: 100px;私は 3 つの div を持っています。それらがすべて 1 つの列 (3 行のテーブルのように) に積み上げられていると想像してくださいposition: absolute;。私のフォームの一番下。

フォーム全体の高さは、フォーム内の他の要素によって異なる可能性があるため、中央の div を他の 2 つの div の間に配置し、コンテンツに合わない場合はスクロールする必要があります。

(たとえば、ヘッダーとフッターは100px高さで、フォームは500px高さだけで、中央の div のテキストは非常に長い) <- 現時点では、中央の div が展開され、フォーム全体が引き伸ばされます。

要素の配置、マージン、パディングでこれを解決するために多くのことを試みましたが、まだ成功していません...誰か助けてくれますか? ありがとう！

4

2 に答える 2

1

次の方法で実行できます。jsFiddle

CSS

.header, .footer {
    background-color: green;
    height: 100px;
    width: 100%;
}
.form {
    height: 300px;
    position: relative;
}
.content {
    position: absolute;
    top: 100px;
    bottom: 100px;
    overflow-y: scroll;
}
.footer {
    position: absolute;
    bottom: 0px;
}
于 2013-09-12T17:20:13.850 に答える