CSS: z-index

Salve a tutti, mi potreste aiutare su questo, "forse banale", errore ??? :oops: Qui di seguito vi scrivo, sia il codice del file html e qello del css esterno Se volete vedere il problema, create 2 file, uno .html e uno .css con il testo che vi scrivo di seguito. La domanda è questa: Perchè il BOX GRIGIO, nonostante scrivo z-index3 non mi viene in primopiano? GRAZIE A TUTTI :D :D allego testo: [code:dn25c3g2]<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>PROVA POSIZIONE ELEMENTI</title>
<link href="position.css" rel="stylesheet" type="text/css" />
</head> <body> <div id="box1">GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO </div> <div id="box2">BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU </div> <div id="box3">GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO </div> </body> </html>[/code:dn25c3g2] CSS esterno [code:dn25c3g2]
@charset "UTF-8";
/* CSS Document */ body
{ margin: 0; padding: 0;
} #box1 { position: absolute; top: 0px; left: 0px; width: 100px; background-color:#FF9; border: 2px solid #936; z-index: 1;
} #box2 { position: absolute; top: 0px; left: 0px; width: 300px; background-color:#0CF; border: 2px solid #936; z-index: 2;
} #box3 { margin-left: auto; margin-right: auto; width: 600px; background-color:#CCC; border: 2px solid #936; z-index: 3;
}[/code:dn25c3g2]

 Gatto Silvestro, N.D.

:lol: :lol: :oops: :oops: Mi rispondo da solo ..... mi son accorto ora che mancava un trattino .... io, nel css, ho scritto: z-index: 1;
mentre è corretto: z-index:-1; grazie lo stesso a tutti voi :D :oops: :oops:

 Gatto Silvestro, N.D.

Re: CSS: z-index

Benvenuto Signor Gatto Silvestro! bò... io non vedo questa sovrapposizione ho fatto un esempio mio mettendo
tutti e tre i box uno sopra l'altro non so se può servire...
questo è al naturale come si presentano i div
[url=http://max400.netne.net/scaletta-div-senza-sovrapposizione.html:3te00jl4]esempio div al naturale[/url:3te00jl4] questo invece è con i div sovrapposti
[url=http://max400.netne.net/scaletta-div-css-z-index-position.html:3te00jl4]div sovrapposti[/url:3te00jl4] questo è lo script nome file: scatole.css [code:3te00jl4]#box1{
position: absolute; top: 0px; left: 8px; width: 300px; background-color:#FF9; border: 2px solid #936; z-index:1;
} #box2{
position: relative; top: 50px; left: 0px; width: 300px; background-color:#0CF; border: 2px solid #936; z-index:2;
} #box3{
position: relative; top: -50px; left: 0px; width: 300px; background-color:#CCC; border: 2px solid #936; z-index:3;
}[/code:3te00jl4] e questa la pagina esempio.html che aspira il css
[code:3te00jl4]<head>
<link href="scatole.css" rel="stylesheet" type="text/css" />
</head> <body> <div id="box1">
GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO GIALLO </div> <div id="box2">
BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU BLU </div> <div id="box3">
GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO GRIGIO </div> </body> [/code:3te00jl4]

 max_400, N.D.

Grazie 1000 MAX :)

 Gatto Silvestro, N.D.
001design.it ® è un marchio registrato.
© 2004-2017 Molfese Paolo - P.Iva: 03430820617 - All rights reserved | Tutti i diritti sono riservati.