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

Resized background image

From: Oren Ben-Kiki <oren@capella.co.il>
Date: Sun, 6 Jun 1999 11:41:21 +0200
Message-ID: <01a001beb000$bc8bf510$5402a8c0@oren.capella.co.il>
To: "Style Sheet mailing list" <www-style@w3.org>
We're translating some private presentation format to CSS and have hit the
following problem. We'd like to have an element with a background image
which is resized to fit the element (instead of being tiled), something we
would have liked to write as:

<SPAN STYLE="
    background-image: ...;
    background-size: 100% 100%;
    position: absolute;
    width: ...;
    height: ...;
">
...some stuff here...
</SPAN>

But where the image is resized to fit the element. We've ended up adding an:

<IMG HREF="..." STYLE="
    width: 100%;
    height: 100%;
    z-index: -1;
">

Within the SPAN. This isn't quite right, however; for example it interacts
badly with scrolling, and DOM manipulation of the image is very different
then any other type of a background image.

We've already got background-position, so having a background-size attribute
doesn't seem out of place. How about adding it to CSS3?

Another question: suppose that a background-position is specified together
with a repeat in the same axis, for example:

background-position: 50% 0%;
background-repeat: repeat-x;

Should the background image cover only half the element (the right one), or
should it cover it all? IMO controlling the position of the tiling boundary
while covering the whole element is more important/useful/intuitive then
covering just a part of the element, but the CSS2 specifications aren't
clear on this. IE4 implements this as partial element cover, but that
doesn't prove a thing :-)

Share & Enjoy,

    Oren Ben-Kiki
Received on Sunday, 6 June 1999 05:46:16 GMT

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