Strange printing problem using 'position:absolute'

[ZeeKoei]

Hi

I have a problem with the absolute positioning of a table, drives me insane

with this code you can create a little table 150px from top with two rows text and a little thin separator line in between those two rows
everything ok, it seems
BUT ! if you want to print the page (or just view the print preview) and print background images is enabled then you notice that my cute little separator line becomes a big thick fat line !
When I omit the absolute positioning then the problem disappears but the table is part of a more complicated page, in which the absolute positioning is absolutely necessary.

does anyone know the reason of this prob and how to solve it ?

thanks

Wouter

<DIV style='position:absolute; top: 150px; '>
<table width= 100 >
<tr>
<td>row content 1</td>
</tr>
<tr>
<td bgcolor=black height=3px></td>
</tr>
<tr>
<td>row content 2</td>
</tr>
</table>
</DIV>

[apezVal]

You might try placing this with the META tag block-set:

<STYLE TYPE="text/css" MEDIA="print">

Please let me know if this helps.

__ JIM G.

[nkaisare]

Originally posted by ZeeKoei
You are misusing the tables. That is the problem.

<td bgcolor=black height=3px></td>
This need not give you desired result. Table cell will resize to fit its content. Probably, while printing, your browser assumes the specific td to contain a space, while screen display assumes the td to be empty. May be the following link would help:
http://devedge.netscape.com/viewsource/2002/img-table/

You may think of using this instead:

<div style="position: absolute; top: 150px; left: 0; width: 100px">
<p style="margin: 0; padding: 2px; border-bottom: solid black 3px">row content 1</p>
<p style="margin: 0; padding: 2px;">row content 2</p>
</div>

(Replace padding: 2px with whatever cellpadding you used for your table)