CODEWITHSUNDEEP
javascripthtmlcsscss-positionz-index
samuelorobosa
samuelorobosa

Reputation: 65

How to know the z-index of two elements

I have two carousels which one of them is set to absolute and a toggle button above them which switches them out when I switch to the second one.

I can't click it, I feel the error is from z-index but I didn't set any z-index on any of the elements, is there a plugin to view their z-index?

Upvotes: 4

Views: 5826

Answers (3)

Engin
Engin

Reputation: 815

If you are using chrome, you can check it in developer tools.

Right click on the element you want to check and inspect element. Switch to elements tab in developer tool then click on computed tab. It shows you all computed styles in alphabetical order.

enter image description here

Upvotes: 7

sshopov
sshopov

Reputation: 220

You can get the element, then extract the styles. Then you can get the value of style property by using camelcase for the css attribute name.

const style = getComputedStyle((document.getElementById("element"));

const zIndex = style.zIndex;

console.log(zIndex);

Upvotes: 0

Scott Anderson
Scott Anderson

Reputation: 693

Maybe I missed the point of the question, but simply using 'inspect' on Firefox or Chrome will allow you to see all styling properties on all element.

To get there:

  1. Right click the element you want
  2. Select 'inspect element'

firebug as you can see the header of this very page has a z-index value of 5050

Upvotes: 1

Related Questions