Hello,

I am trying to build a watermark with a title and subtitle using css and prince.

The watermark works fine and is positioned properly using just one header.

As soon as I add another header with just pure content, the positioning completely changes and nothing is where it should be. No clue why this would ever happen.

If I change any css in either headers, both headers are changed in some way. I don't know why the styling from one header would change the styling of another header, as this makes it pretty much impossible to work with, and leaves me stuck guessing and checking.

I just want to have two separate headers, one under the other.

Is there any was to get this to work?

@page{
	@top-center{
		content:'Trial Account';
		color: rgba(0,0,0,0.4);  /* 50% opacity - normal opacity property cannot be used with docraptor for text */

		padding-top:39in;
		height: 1.5in;
		margin-left: -19in;


                -ms-transform: rotate(-45deg); /* IE 9 */
		-webkit-transform: rotate(-45deg); /* Chrome, Safari, Opera */
		transform: rotate(-45deg);
		transform-origin: bottom left;
		font-size: 700%;
		font-family:"Proxima Nova W08 Reg","Open Sans";

		@top-left{
			content: 'Breaks all positioning on top-center, css from either header affects the other'
                 }

Normally the page margin-top will be divided up automatically between the available margin boxes similarly to as if they were table cells, so as the @top-left margin box expands the @top-center margin box will shrink.

What about using @top-left-corner instead?