transform function throws off page height

[Jim Wall]

I'm using a transform function to rotate some of my text in the html before generating a pdf out of it.

Problem is that the transform seems to cause wkhtmltopdf to incorrectly estimate the size.  A rotated block of text might be 100px wide by 300px long, rotated so that it's 300px wide by 100px long, but the pdf ends up with a blank section below it of 200px.  When it's a multipage pdf, this either forces me to include a pagebreak (so I get a blank page in between) or the next text will be offset by that much space.

Is there anyway to get around this?

I'm using:

.sideways-text {

    text-align:left;

    font-size: 14px;

    color: #fff; */

    line-height: 1.5;

    position:relative;

    top: 0px;

    -webkit-transform: rotate(270deg) translateY(00px) translateX(-380px); /* 30, -70 */

    -moz-transform:    rotate(270deg) translateY(00px) translateX(-380px);

    -ms-transform:     rotate(270deg) translateY(00px) translateX(-380px);

    -o-transform:      rotate(270deg) translateY(00px) translateX(-380px); 

    transform:         rotate(270deg) translateY(00px) translateX(-380px); 

    -webkit-transform-origin: 0 0; /* 1.8em .5em;  */

    -moz-transform-origin:    0 0; /* 1.8em .5em;  */

    -ms-transform-origin:     0 0; /* 1.8em .5em;  */

    -o-transform-origin:      0 0; /* 1.8em .5em;  */

    transform-origin:         0 0; /* 1.8em .5em;  */

}

with 

<table style="border:solid 1px black;margin-top:0px;height:840px;width:30%;" class="sideways-text">

    <tr><td style="padding:20px;margin:20px;font-size:11px;"><h1><CENTER>IMPORTANT NOTICE</CENTER></h1>

blah blah blah, more html

</table>