css - 高さの関数としてのCSSマージントップ

Question

高さが固定された要素を使用せずに、要素のマージントップを高さの半分に設定することはできますか？

Answer 1

デモ：http： //jsfiddle.net/6qsvt/

jquery

    $(function() {
    // vertical align function
    $.fn.vAlign = function() {
        return this.each(function(i){
            var ah = $(this).height();
            var ph = $(this).parent().height();        
            var mh = Math.ceil((ph-ah) / 2); //var mh = (ph - ah) / 2;
            $(this).css('margin-top', mh);
            console.log(mh);
        });
    };

    $('#i').vAlign();

});

Answer 2

Calcはあなたを助けるかもしれませんが、それはまだドラフトです。次のリンクを確認してください：calc

それをattrと組み合わせると、次のような凝ったことをすることができます。

margin-top: calc(50% * (attr(width))