Previous Page

Next Page

Flying Saucer XML/CSS2 Renderer

Z-index support includes: assigning the z-index to any positioned block-level element. In this example, we have a series of divisions, each with a colored background, with a decreasing index so that each subsequent element shows below (behind) the previous one. There is then a fixed element in the middle of the page which has z-index of 0, and shows up behind all the others. If you resize the page to enable the scrollbars, you can scroll and watch the fixed-position divisions scroll nicely behind the colored boxes. z-index works on any positioned content, including relative inline layers.