javascript - ビューポートの 50% を垂直方向に整列

Question

ドキュメントの長さに関係なく、ビューポートのadivを垂直方向に揃えようとしています。50%

ここで例を見ることができますhttp://fancyapps.com/fancybox/#examples

Answer 1

ボックス オフセット プロパティを使用して、この効果を得ることができます。

このプロパティは、絶対配置されたボックスの上マージンの端が、ボックスを含むブロックの上端からどれだけ下にオフセットされるかを指定します。

ソース: http://www.w3.org/TR/CSS2/visuren.html#position-props

---

jsfiddle

CSS

#centered {
    position: fixed;
    top: 0;
    bottom: 0;
    right: 0;
    left: 0;
    margin: auto;
    height: 200px; /* arbitrary */
    width: 600px; /* arbitrary */
    background-color: grey;
}