Forum How do I...?

background-image not showing behind table

mwiik
Hello, I'm working on creating pdf's via xhtml where there's a need to show a background image under a table. This works fine on web pages, see http://mdk12.org/data/MSA/SubGroups.aspx?Nav=1.2:5.1:10.99:15.99:2.22:20.1:3.1 for an example. The vertical green AMO line is a positioned background-image assigned to a div enclosing the table.

You can see an image of the web page here: http://emberapp.com/mwiik/images/summary-page-1-mockup/sizes/o

My html is:

<div class="horizontal-gapline">
<table class="databargraph" cellpadding="0" cellspacing="0">
...
</table>
</div>


My css is:

div.horizontal-gapline {
width: 720px;
padding-top: 2px;
padding-bottom: 0;
background: url('data/images/amogap_green_2x2000.gif') no-repeat 602px 0;
}

I did have the y-pos at 10px, since as currently set (0) it shows thru at the very top of the table, right above the 'How did our school and subgroups perform this year?' caption, or right under the 'd' in 2010 MSA Reading. Nonetheless I set it to 0 for a pdf test, and I can see this in my pdf output, which is viewable at: http://emberapp.com/mwiik/images/summary-page-1-mockup-pdf-1-page/sizes/o

As you can see, the green line is not showing behind the table in the pdf, except for the few pixels peeking out above the caption. (While there is a border under the left-side portion of the table containing the fractions, there is no border on the right side with the bar graphs - if there was, this would overwrite the green vertical line)

I'm running PrinceXML version 7.0 on OS X 10.6.3. (This will be served on a Windows server running a licensed copy of PrinceXML)

Disclaimer: all the data in this table is fake and for mockup and illustrative purposes only.
mikeday
I'm a bit unclear about this, as testing Prince on the first URL that you gave results in a PDF that does have the green line, and looks correct. Which input document did you use to create the PDF that is missing the green line?
mwiik
I can confirm that (once fixed to remove the single well-formedness error) the example mdk12.org URL background image worked fine with Prince.

In any case, I had changed the background-image to be part of the table cell holding the bar graphic instead of a div surrounding the table, which worked fine.