0

I am trying to add the below style for watermark.The watermark appears only in the first page when i try to print in Chrome.It works fine in firefox and IE.

<style type="text/css">
#watermark {
  color: #d0d0d0;
  font-size: 90pt;
  -webkit-transform: rotate(-45deg);
  -moz-transform: rotate(-45deg);
  transform: rotate(-45deg);
  position: fixed;
  width: 100%;
  height: 100%;
  margin: 0;
  z-index: 100;
  opacity: 0.5;
}
</style>

<div id="watermark">
<p>WaterMark</p>
</div>

Is there any way which can be used to print the watermark in all pages

Take a look at this fiddle: http://jsfiddle.net/gskzkb8g/

Koen Peters
  • 12,798
  • 6
  • 36
  • 59
geekops
  • 505
  • 8
  • 21

1 Answers1

1

I think that this is due to the position:fixed. The web has no native pagination, it's just one long page. Your position fixed will stay in the viewport when you scroll, but it only appears once when you print it in Chrome.

I think that what you're trying to do is not possible. Also look at this SO answer: https://stackoverflow.com/a/5886308/1236396

Community
  • 1
  • 1
Koen Peters
  • 12,798
  • 6
  • 36
  • 59
  • Yes.I found that its a known issue in Chrome..jus want to know the alternative... even @media print doesnt work – geekops Sep 08 '14 at 15:38
  • If you read the page I linked to you'll see that there is no solution. What you're trying to do isn't possible – Koen Peters Sep 08 '14 at 15:39