CSS Z-index Property
Posted The: 31/05/2009 At: 11:52
Contents:
The z-index property is used to position elements, visually, on top of each other. Where z can represent the z-axis.
Z-index can be used in conjunction with css position, to enable designers to use "Layer Page Technique's".
For example, consider that you have a Sky as a background image, instead of using one big image, you can now simply use a gradient, and place the skys as transparent png using css positioning.
How to use Z-index
For z-index to work, the element to witch its applied, must have its position set to something else then static, which is the default position.
Example
#Color1 {
position: relative;
z-index: 1;
background: #FF7751;
width: 150px;
height: 150px;
}
#Color2 {
position: absolute;
z-index: 2;
background: #FF5BBA;
width: 150px;
height: 150px;
top: 25px;
left: 25px;
}Inherited? NO!
Comments: [0]
