Member 12503744 Ответов: 0

Свойство Z-index @media print CSS не применяется при печати (window.print ()) страницы

У меня есть кнопка печати моей страницы, которая выполняет window. print () поэтому при нажатии кнопки печати я хочу тот же вывод, который я получаю на странице, но при печати страницы он не приходит так, как ожидалось, пожалуйста, нажмите на приведенные ниже ссылки для скриншотов вывода, который я получаю. Заранее спасибо.

O/P на веб-странице: http://i.stack.imgur.com/fOkH7.png[^]

O/P на странице предварительного просмотра печати: http://i.stack.imgur.com/TAryy.png[^]


<html>
<head>
<style>
@media print {
.h6 {
    text-align: left;
    padding-left: 30px;
    position: relative;
    z-index: 2;
}

.line-center {
    margin: 0;
    padding: 0 10px;
    background: #fff;
    display: inline-block;
}

.h6:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    border-top: solid 1px lightgrey;
    z-index: -1;
}
}
.h6 {
    text-align: left;
    padding-left: 30px;
    position: relative;
    z-index: 2;
}

.line-center {
    margin: 0;
    padding: 0 10px;
    background: #fff;
    display: inline-block;
}

.h6:after {
    content: "";
    position: absolute;
    top: 50%;
    left: 0;
    right: 0;
    border-top: solid 1px lightgrey;
    z-index: -1;
}

<style>
<head>
<body>
<h6 class="h6"><span class="line-center">Hello StackOverflow</span></h6>
</body>
</html>


Что я уже пробовал:

Я включил свойства css, используемые в @media print, но они не применяются.

0 Ответов