css - 垂直方向に中央のdivだけでなく、20pxのマージンの上下

Question

モーダルウィンドウを垂直方向に中央に配置するだけでなく、上部と下部の端から20ピクセルの距離を保つにはどうすればよいですか？

これが私が現在持っているものです：

#colorbox, #cboxWrapper{position:absolute; top:20px; bottom:20px; left:0; z-index:9499;}

上部に20pxのマージンが作成されますが、下部には作成されません。何故ですか？

ありがとう！

Answer 1

フィドル： http： //jsfiddle.net/BZKHq/1/

HTML：

<p>Lorem or whatever makes your ipsum dolorful Lorem or whatever makes your ipsum dolorful Lorem or whatever makes your ipsum dolorful Lorem or whatever makes your ipsum dolorful Lorem or whatever makes your ipsum</p>

<div id="overlay">Lorem ipsum and stuff...</div>

CSS

#overlay {
    color:white;
    background-color: black;
    position:absolute;    /* <<<--- The trick starts here ---<<< */
    bottom:0;
    top:0;
    left:0;
    right:0;
    margin:20px;    /* <<<--- The trick ends here ---<<< */
    padding:20px;
    z-index: 10000;
}