我的CSS打印发生了什么？

Question

这是我的CSS代码：

 @media print
        {
            body *
            {
                visibility:hidden;
            }
            #printable *
            {
                visibility:visible;
            }
            #printable
            {
                margin:0px;
                color : #000000;
                background : #ffffff;
                filter: Gray();
                filter: url('#grayscale'); 
                -webkit-filter: grayscale(100%); 
                filter: grayscale(100%);
                top:0px;
                left:0px;
            }

            @page
            {
                size:auto;
                margin:0mm;
            }

        }

我有这样的div

<div class="row" id="printable">

   ...

</div>

当我在网页上打印时，上半部分有太多空白，主要内容在纸张中开始几乎一半。我的CSS有问题吗？

很抱歉，如果我无法显示图片..

Answer 1

错误！ #printable仍然具有可见性：隐藏，将代码更改为：

 @media print
        {
            body *
            {
                visibility:hidden;
            }
            #printable *
            {
                visibility:visible;
            }
            #printable
            {
                margin:0px;
                color : #000000;
                background : #ffffff;
                filter: Gray();
                filter: url('#grayscale'); 
                -webkit-filter: grayscale(100%); 
                filter: grayscale(100%);
                top:0px;
                left:0px;
    visibility:visible;
            }

            @page
            {
                size:auto;
                margin:0mm;
            }

        }