0

divを別のdiv内に垂直に配置しようとしています。両方にパーセンテージの高さがあるため、問題が発生します。これが私のjsfiddleです:http://jsfiddle.net/QeF23/1/

html, body {
    height: 100%;
    padding: 0px;
    margin: 0px;
}
#outerdiv {
    height: 50%;
    width: 100%; 
    background-color: #000000;
}    
#innerdiv {
    height: 90%;
    background-color: red;
    float: right;
}

高さのパーセンテージが必要ない場合、これは非常に簡単に解決できます。

display:table-cellメソッドを使用してみましたが、うまくいきませんでした。でも、間違って実装していたのかもしれません。

どんな助けでも、大いに感謝します。

4

2 に答える 2

3

あなたのJSフィドルは正しいように見えます-あなたがそれを真ん中に揃えようとしているなら、多分追加してみてください

#outerdiv {
    height: 50%;
    width: 100%; 
    background-color: #000000;
    position:absolute;
    top:25%;
}        

編集-赤のdivを黒の中央に配置する場合は、同じ原則を使用します。

http://jsfiddle.net/QeF23/30/

#outerdiv {
    height: 50%;
    width: 100%; 
    background-color: #000000;
    position:absolute;
    top:25%;
}       
#innerdiv {;
    position:absolute;
    width: 100%; 
    top:5%;
    height: 90%;
    background-color: red;
}
于 2013-03-26T00:36:51.453 に答える
1

この記事http://css-tricks.com/centering-in-the-unknown/を読んでください。記事の最後で、彼はゴースト要素を使用したトリックについて説明しています。私は前にそれを試しました、そしてそれは私のために完全に働いています。

于 2013-03-26T00:37:01.800 に答える