layer-background-image

Support Key: [4.0-4.x]
 Other Color/Background Properties
color
layer-background-color
background
background-color
background-image
 background-repeat
background-attachment
background-position
background-position-x
background-position-y
= Index DOT Css by Brian Wilson =
  Main Index | Property Index | CSS Support History | Browser History  


   Quick Statistics   
Default Value:
   none
Applicable Elements:
All
Inherit From Parent:
No
Applicable Media:
Visual
HTML Equivalent:
<body BACKGROUND="URL">
Official Docs:
None
What is it?
This value sets the background-image for the entire region of the current element. This proprietary property behaves in Netscape the way the 'background-image' property SHOULD behave, while the actual 'background-image' behavior is buggy in this regard. This property was invented to create the correct behavior.

The 'background-image' property only covers the content area of an element's rendering box, and if a border is also used, there is a slight gap (2-3 pixels) between the background-image and the border area, where the surface of the parent element shines through.

The 'layer-background-image' covers the whole region specified by the element, including the gap area occurring for the 'background-image' property, and the entire dimension of the element specified by the 'width' and 'height' properties. Since this property is only understood by Netscape, and it fixes other buggy behavior, specifying both this and the 'background-image' property with the same value seems like a good idea.

Allowed Values
[url]
[4.0-4.x]
Type: User Specified
Description:
It can be either an absolute or relative URL. Please see the section on URL Units for details on how to indicate a URL within a Style Sheet.
none
[4.0-4.x]
Type: Explicit
Description:
No image is used as the background for the element.
Example
Ext/Doc:
div {
     position: absolute;
     top: 100px; left: 300px;
     width: 200px; border: thin solid black;
     background-image: url(http://www.example.com/bg.gif);
     layer-background-image: url(http://www.example.com/bg.gif);
     }
In-Line:  <div STYLE="position: absolute;
     top: 100px; left: 300px;
     width: 200px; border: thin solid black;
     background-image: url(http://www.example.com/bg.gif);
     layer-background-image: url(http://www.example.com/bg.gif);">text block</div>
Notes Browser Peculiarities

Boring Copyright Stuff....