Open Source Tutorials - Open Source Training
Open source training & tutorials from experienced, passionate people
chrome icon firefox icon ie icon opera icon safari icon Sings in these Browsers
A- A A+

By A Web Design

Welcome, Guest
Username Password: Remember me
All your queries regarding CSS will be solved in this forum
  • Page:
  • 1
TOPIC:

Using Z-Index

Using Z-Index 1 year, 9 months ago #106

  • yoko
Hi,
Can someone please explain me how to use Z-index property? I am facing a browser compatibility issue. Hence could not make out what is wrong whether it's value of Position property or Z-index property. Please brief me.

Re:Using Z-Index 1 year, 9 months ago #110

  • shama
  • OFFLINE
  • Senior Boarder
  • Posts: 63
  • Karma: 0
In simple words, the higher a z-index value is, the element will be on top of the others. A z-index can be negative which tells the browser to put it lower than other elements on the page.

How to Use:

Use z-index with any element you want to position. You need to have the position attribute set, usually to position:absolute; But the specification says that z-index will work with relatively positioned elements as well. Below are standard values set by me -

• 100 for top-most element
• 0 for middle element
• -100 for bottom element

That way, if we decide we need additional elements stacked in other places, we can still stack them. We can also give two elements the same z-index value. If these elements are stacked, they will display in the order they are written in the HTML, with the last element on top.
  • Page:
  • 1
Time to create page: 1.18 seconds
OSV Newsletter


Receive HTML?

NOTE: To prevent subscription to the OSV newsletter, uncheck the checkbox above.
Guest Blog for OSV
Free Ebook Download