Categories
CSS & HTML Tips

CSS z-index doesn’t work?

CSS style property z-index determines the stack order of an element overlapping with others. There might be times when you find it not working for you and element with a bigger z-index falls behind one who has a smaller one.

Frustrating but why?

First, make sure the elements who has z-index property also has position:relative or position:absolute.

z-index simply doesn’t work on elements who are position:static which is unfortunately also the default position style for all HTML elements if you don’t specify otherwise.

Now is it working correctly?

Well, to understand more about the z-index thingy, head to here.

By Yang Yang

Hello, I'm Yang. I build online businesses that please people. Want to join in and post some useful articles on Kavoir.com? Shoot me a message.

11 replies on “CSS z-index doesn’t work?”

Hi!

i still have problems with z-index, even if all my elements are positioned.

i hope you can help me, thank ypu in advanced!

this is an example:

AC_FL_RunContent( ‘codebase’,’http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=9,0,28,0′,’width’,’860′,’height’,’406′,’src’,’container_1′,’quality’,’wmode’,’opaque’,’high’,’pluginspage’,’http://www.adobe.com/shockwave/download/download.cgi?P1_Prod_Version=ShockwaveFlash’,’movie’,’container_1′ ); //end AC code

thank you in advanced

sorry , i forgot some detail in the last post!

i try to set a z-index in a div that contain a flash object, and over the flash object are some others div. all div has positioned and z-index,

this work in firefox 3.6 and safari on mac

but doesn’t work in IE, chrome, firefox windows
and chrome mac

i tryed settin the wmode=opaque and transparent but no fixing the problem

hope i explain clear!

thank you !

thank you it is working.but facing another issue.
i am appling z-index property to parant child div.
i want my child div height and width should adjust according to parent div.
but on resizing window it is not working fine.
could you help me out for this ?

Is applied but does not work. Why not apply a “second” when you already have a “first”. Crappy blog post, really.

Comments are closed.