18041 sujets

Questions générales et questions de débutants

Probleme avec z-index

Bonjour, j'apprend en ce moment le css avec le livre "pratique du css et javascript" et l'exemple suivant ne fonctionne pas sur firefox. (dans IE je ne sais pas car je suis sur linux Ubuntu)

Voici le code : 

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<style type="text/css">

p
{
  border-style:solid;
}

img.audessus
{
  position:absolute;
  top:0;
  left:0cm;
  
  z-index:1;
}

img.audessous
{
  position:absolute;
  top:0;
  left:5cm;
  
  z-index:-1;
}
</style>
</head>
<body>

<p>
Ceci est un paragraphe normal.
Ceci est un paragraphe normal.
Ceci est un paragraphe normal.
Ceci est un paragraphe normal.
Ceci est un paragraphe normal.
Ceci est un paragraphe normal.
</p>

<img class="audessus" src="dessin.gif">
<img class="audessous" src="dessin.gif">


</body>
</html>


Et l'image possédant la classe audessous ne s'affiche pas , alors
que pourtant celle ci devrait apparaitre en dessous du paragraphe est à 5
cm en partant de la gauche.

D'ou vient le problème selon vous ?

Je vous remercie par avance.
Hello.

Essaye de remplacer ton 
  z-index:-1;
.
En effet, on ne doit pas utiliser de valeurs négatives pour les z-index.
Utilise plutot 1, 2, 3, etc...

J'ai trouvé l'info sur ce site
Modifié par carobee (28 Sep 2007 - 16:38)
A proiri, pour le W3C (CC2) cette valeur négative semble tout à fait correcte :
a écrit :
4.3 Values
4.3.1 Integers and real numbers
Some value types may have integer values (denoted by <integer>) or real number values (denoted by <number>). Real numbers and integers are specified in decimal notation only. An <integer> consists of one or more digits "0" to "9". A <number> can either be an <integer>, or it can be zero or more digits followed by a dot (.) followed by one or more digits. Both integers and real numbers may be preceded by a "-" or "+" to indicate the sign


source

Ce site confirme également qu'une valeur négative peut être appliquée à la propriété z-index : http://archivist.incutio.com/viewlist/css-discuss/5061

Smiley cligne
Sujet clos
Aller à