CSS margin-top作为高度的函数

Question

是否可以在不使用固定高度的元素的情况下将元素的margin-top设置为其高度的一半？

Answer 1

DEMO： 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))