Forum Moderators: not2easy
Here is a basic example of what I am trying, but isn't working... I am trying to wrap the entire page in the "entirepage" DIV, then only print the "printable" DIV (stripping the page of it's table formatting).
<style>
@media print{
#entirepage {display:none;}
#printable {display:block;}
}
</style>
<DIV id="entirepage" style="display:none;">
Dooooooooon't print me!
<table width="770">
<tr>
<td width="200">
Side Navigation - dooooooooooon't print me!
</td>
<td width="570">
<DIV id="printable">
Printable content goes here!
</DIV>
</td>
</tr>
</table>
</DIV>
-------------------
The result of this is that it prints nothing... I need printable to print.. minus any surrounding HTML that is necessary.
Anyone got any ideas?
Does anyone know how to stop the inheritance of a parent DIV to it's child DIV(s)?
The Visual Formatting Model [w3.org] of the CSS Spec is a good place to look ;-)
Specifically, if you check the display [w3.org] property, you'll see that you're going to have to re-think how you accomplish this; "display:none"
... causes an element to generate no boxes in the formatting structure (i.e., the element has no effect on layout). Descendant elements do not generate any boxes either; this behavior cannot be overridden by setting the 'display' property on the descendants.[Emphasis in original]
There are a couple of other ways to achieve what you're after though:
-b