Maximale CSS Z-Index-waarde

Een paar maanden geleden lanceerde ik een nieuwe site en kreeg ik een klacht dat een leaderboard-advertentie boven een vervolgkeuzemenu op de pagina verscheen. Eenvoudig genoeg, ik inspecteerde het css van de advertentie, zag dat het een z-index van 999 had en verhoogde de z-index in het menu tot 1.000. Probleem opgelost. Zelfde probleem opnieuw een paar weken later, verhoogd tot 10.000. Ook vandaag moest ik een andere advertentie inspecteren die hetzelfde probleem veroorzaakte. Het had een index van 1 miljoen. Hoe irritant.

Dat zette me echter aan het denken, wat is de maximale waarde waar ik een z-index voor zou kunnen instellen. Als we kijken naar verschillende CSS-documentatie, leek er geen maximale waarde te zijn opgegeven. Het antwoord in Firefox, IE en Chrome is:

2147483647

Dat is de maximale waarde van een 32-bits integer getekende waarde. Technisch gezien zou ik me kunnen indenken dat deze beperking afkomstig is van de programmeertaal waarin de browser is gemaakt. Ik weet zeker dat er enkele oudere browsers zijn waar het instellen van deze waarde ertoe zou kunnen leiden dat er iets breekt. Interessante dingen echter. Dus als je ervoor wilt zorgen dat je element 100% zeker bovenaan staat, stel het in op 2147483647. Probleem opgelost. In werkelijkheid vond ik het echter erg vervelend dat een advertentie het op zo'n hoog aantal had ingesteld. Overweegt u op een bepaalde pagina, dan zal er een zeer beperkt aantal lagen zijn. Als u deze op een veel kleiner aantal zet, moet dit lukken.

Zie Ook