Menu
I've been searching for a while for an answer to my question:
Does negative z-index have any side effects
And I've already asked before here: Does negative z-index affect performance or compatibility? but it doesn't get enough attention (may be because I mixed things a little bit)
And I wanted to try and asked in a other way.
I am developing a web application for cross platforms (different browsers, devices), and sometimes I am in need to use a negative value for the z-index property, but I'm afraid if it can have any side effects on any/some browser and break the compatibility.
I hope I made the question clear :)
564
You can have negative z-indexTo place an element on a layer below another one, it just has to have a lower value of z-index but that lower value can be negative. One area where this is useful is when using pseudo elements and wanting to position them behind the content of their parent element.
The z-index property can be specified with an integer value (positive, zero, or negative), which represents the position of the element along the z-axis.
css("z-index", ''); Extract from the documentation : Setting the value of a style property to an empty string — e.g. $('#mydiv'). css('color', '') — removes that property from an element if it has already been directly applied, whether in the HTML style attribute, through jQuery's .
The maximum range is ±2147483647. In CSS code bases, you'll often see z-index values of 999, 9999 or 99999.
Negative values are fine after Chrome 1.0, FireFox 3.0, IE 4.0, Opera 4.0, Safari 1.0. So basically if you don't live in 2000 you should be fine using negative z-indices. MDN doesn't seem to have any data for mobile devices though, but I would imagine since it's in the spec that most mobile browsers will also be fine.
Browser support of negative z-index values (CSS 2.1) according to the MDN
102
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
