CSS: @media print & column-count вообще не работает

Question

У меня есть div с тремя вертикальными div в нем. Внутри этих внутренних элементов есть элементы с CSS-свойством column-count (работает хорошо, см. Ниже).

Рабочая часть это (для нескольких размеров экрана) в качестве примера:

@media only screen and (min-width: 1100px) {
.masonry {
    -moz-column-count: 2;
    -webkit-column-count: 2;
    column-count: 2;
}
}

Может кто-нибудь сказать мне, почему следующий код не работает, когда я пытаюсь распечатать страницу?

@media print {
.masonry {
    -moz-column-count: 2 !important;
    -webkit-column-count: 2 !important;
    column-count: 2 !important;
}
}

Запрос на печать @media работает с

@media print {
    body {
    display: none;
    }
}

например.

Я пробовал Safari и FF на Mac OS X.

Спасибо!

Answer 1

Это известная ошибка в Chrome

https://code.google.com/p/chromium/issues/detail?id=99358

Эта ссылка может быть полезна для вас:

CSS-столбцы ломаются при печати

Это небольшая ссылка, которую попробует один пользователь:

http://blog.pdark.de/2010/11/19/printing-web-pages/

Удачи