z-index

[davy_yg]

index.php

<div style="width: 220px; color: black; margin: 0 0 0 800px; z-index: 2;">

<?php

// How can we help

$result = mysql_query("SELECT * FROM `static_page` WHERE post_id='27'") or die(mysql_error());

echo '<td>';
while ($data = mysql_fetch_array($result)){
       $isi = $data['isi_berita'];
       echo '<h2>'.$data['judul'].'</h2><br><br>';
       echo substr($isi, 0, 1000).'<br>';
}

?>      
</div>

<div style="margin: -250px 0 0 730px; position: relative; z-index: 0;"><image src="images/help.jpg"></div>

I wonder why z-index:2 which is suppose to be on top of z-index:0 does not work as it suppose to be. The fact is the contrary.

[JorgeM]

Hmm. On my phone so I can't test but what stands out is that you are applying a relative position to the second div. the relative position takes the element out if its normal position.

I can look at this more tomorrow.

[Troy III]

even W3schools got this right:

"Note: z-index only works on positioned elements (position:absolute, position:relative, or position:fixed)."

[!note] Your z-index:2 div element has no position.

Further on, "z-index: 0", (used on your second div) is not a valid z-index css value. Should be a non-zero positive integer or negative. Not sure if you can find this inf., in css documentation though.

[almostbob]

below is not correct, w3c documentaton specifies 'integer' which includes zero, zero is defined as the default base, so the declaration <div style="margin: -250px 0 0 730px; position: relative; z-index: 0;"> is correct, but inline styles suck and should be removed to stylesheets

Further on, "z-index: 0", (used on your second div) is not a valid z-index css value. Should be a non-zero positive integer or negative. Not sure if you can find this inf., in css documentation though.

[Troy III]

z-index:0;
is equivalent to: unspecified / invalid / value failed to be assigned, etc, etc.

div1 > z-index:0 -will be covered by
div2 > [no index specified]

[almostbob]

http://www.w3.org/wiki/CSS/Properties/z-index

The stack level of the generated box in the current stacking context is 0. The box does not establish a new stacking context unless it is the root element.

and
http://www.w3.org/TR/CSS2/visuren.html#propdef-z-index

In the following example, the stack levels of the boxes (named with their "id" attributes) are: "text2"=0, "image"=1, "text3"=2, and "text1"=3. The "text2" stack level is inherited from the root box. The others are specified with the 'z-index' property.

the stack levels of the boxes.. .. "text2"=0 ∴ 0 is valid,

In this case I am one of many who Wrote TFM

[almostbob]

run the css of a div {z-index:0;} through the w3c css validator if you care to.

[almostbob]

Troy_III

I'm sure will provide reference,
that trumps w3c : for the unsupported assertion

until then cease spreading misleading information, don't mess up other people's code

[almostbob]

Troy, "unspecified", is not zero
"unspecified" inherits the parent element z-index, any integer value including zero

please stop fabricating information

[Alicera Nz]

z-index:-1;