Posted by J.B. Moreno on 05/20/07 20:08

In article <97b7c$46504d3b$40cba7a4$2693@NAXS.COM>,
Jonathan N. Little <lws4art@centralva.net> wrote:

> planb@newsreaders.com wrote:

-snip how to print background colors?-
> > <div style= "width:100px; height: 100px;">
> > <div style="border-color:E9E9E8 E9E9E8 E9E9E8 E9E9E8;
> > margin:10px;float:left;border-width:50px;
> > border-style:solid;width:0px;height:0px;
> > line-height:0px;">
> > </div>
> > <span style="position: relative; top: -100px;
> > left: .9em;">
> > This will have a colored <br />
> > background when printing
> > </span>
> > </div>
> >
> > <p />
> >
> > <div style="width: 400px; height: 25px; background-color: E9E9E8;">
> > No colored background when printing...
> > </div>
> >
>
> Note sure what that will accomplish, but one thing I am sure of it is
> not valid CSS.
>
> HINT borders are added *outside* of a block, what you have here would be
> a 100px square block with a 50px wide border!

You say that like it's a problem. It's actually the solution.

The code that will print a "background" color consists of 3 pieces.
(1) a 100px square block, (2) a 0px square block with 50px borders that
are set to a particular color, and finally (3) a span with a relative
position so that it overlays 2.

> Also color values in hex must be designated with a '#"

Yes, the result of some cut-n-paste code. If it kept your browser from
showing what I describe, then my apologies.

--
J.B. Moreno

[Back to original message]