+ 2

How does z-index work in CSS?

I have this code for example: <body> <div id="ejemplo1">Hello</div> <div id="ejemplo2">Hello with z-index</div> </body> Css: #ejemplo2{ z-index: ... }

css html5 z-index

6th Mar 2019, 12:23 PM

Miguel Ángel

4 Answers

+ 9

z-index is something like depth of the element. The element with higher z-index will appear the topmost and vice-versa. NOTE: If we get a 3 dimensional plane of the document , we find x(horizontal axis), y(vertical axis) and z(depth)

6th Mar 2019, 12:28 PM

Seniru

+ 2

Ooh ok men!! Thx Seniru Pasan 👍

6th Mar 2019, 12:31 PM

Miguel Ángel

+ 2

One common use of z-index is to display photos on a page and have them overlapping by using absolute positioning. With z-index, you can specify which images are on top where they overlap. Another common use is when you want a div to overlap a page temporarily, like a welcome message, notification, or an ad. That div would use z-index to cover the page, and would have a javascript link to click on to hide the div.

6th Mar 2019, 3:33 PM

Mike