css3 - z-index property of @media print css is not applying while printing the page -
here css classes:
<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> i have print button on page, executes window.print(). onclick of print button want same output getting on page while printing, page format not coming expected, please click on hyperlinks screenshots of output getting.
Comments
Post a Comment