W3C home > Mailing lists > Public > www-style@w3.org > November 1999

Re: The canvas

From: Matthew Brealey <thelawnet@yahoo.com>
Date: Wed, 24 Nov 1999 04:45:47 -0800 (PST)
Message-ID: <19991124124547.4542.rocketmail@web904.mail.yahoo.com>
To: www-style <www-style@w3.org>
--- I <thelawnet@yahoo.com> wrote:
<blockquote>
If the root element's background is different from
transparent, then it colours the canvas. If it is not,
then BODY's (if relevant in that markup language)
background colours the canvas.

To give some examples:
1. 
HTML {
background: red;
margin: 0;
}
In this example, the canvas will be red, but it will
be entirely covered by the HTML element's content
area, so what will be seen is HTML's background.

2. BODY {
background: green;
margin: 5%;
}

In this example, the canvas will be green, since
background has not been specified on HTML, and so the
canvas is coloured by BODY. BODY is also green, so
although it looks to the viewer of the page like there
is just one green element, what they are actually
seeing is BODY, which is green, plus the canvas, which
is also green.

3. HTML {background: black;}
BODY {background: red;
margin: 5%;}
In this example, the canvas is black, but it is
entirely obscured by the HTML element. The BODY
element is red, and because margins are transparent,
it will have a black margin around it.
</blockquote>

This is satisfactory with bg-color, but not with
bg-image.

Therefore, I propose the following refinements to the
(newly clarified) spec:

<blockquote>
If the root element's background is different from
transparent, then it colours the canvas. If it is not,
then BODY's (if relevant in that markup language)
background colours the canvas.

However, BODY and HTML are given transparent
backgrounds (that is to say backgrounds on HTML and
BODY do not normally colour those elements, but
actually colour the canvas) unless their backgrounds
are different, and neither is transparent, in which
case the canvas is backgrounded by HTML, HTML is
transparent, and BODY is coloured normally.

To give some examples:
1. 
HTML {
background: red;
margin: 0;
}
In this example, the canvas will be red, and although
it will
be entirely covered by the HTML element's content
area, HTML is transparent, so what is seen is the
canvas.

2. HTML {background: black;}
BODY {background: red;
margin: 5%;}
In this example, the canvas is black, HTML is
transparent (thus black), and BODY
is red, and because margins are transparent,
it will have a black margin around it.

3. HTML {background: black}
BODY {background: url(back.jpg) 10% 10%;
margin: 5%}

In this example, since HTML and BODY's margins are
different, the canvas will be black (coloured by
HTML), HTML will be transparent, and BODY's content
area will be covered by back.jpg, and positions will
be relative thereto.

4. BODY {background: url(back.jpg) 10% 10%;
margin: 5%}

In this example, since HTML is transparent, BODY
colours the canvas, and its background positions are
relative to the top left thereof.

</blockquote>

This refinement is necessary, because otherwise the
current (and correct) behaviour whereby bg-pos on BODY
refer to the canvas would be wrong - Bert Bos'
interpretation of the spec works for bg-color but not
for bg-image.



=====
----------------------------------------------------------
From Matthew Brealey (http://members.tripod.co.uk/lawnet (for law)or http://members.tripod.co.uk/lawnet/WEBFRAME.HTM (for CSS))
__________________________________________________
Do You Yahoo!?
Thousands of Stores.  Millions of Products.  All in one place.
Yahoo! Shopping: http://shopping.yahoo.com
Received on Wednesday, 24 November 1999 07:45:49 GMT

This archive was generated by hypermail 2.2.0+W3C-0.50 : Monday, 27 April 2009 13:54:01 GMT