Ciao ho cercato molto per poter risolvere autonomamente questo mio problema,
ma non ne sono venuto a capo.
Ho inserito il codice per poter vedere uno sfondo a tutta pagina, poi ho inserito un div,
all'interno di questo div che chiamo center, c'è un immagine che va a centrarsi nella pagina, ho inserito un altro div che chiamo tabella dove all'interno c'è un file swf.
ed il problema è proprio questo, non riesco a far vedere il div tabella sopra gli altri, ho inserito z-index per dare i livelli ma nemmeno a pregarlo si vede dove lo metto io.
Posto il codice, magari c'è un anima pia che mi aiuta, non so proprio dove sbattere la testa,
Questo è il codice html
<!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 content="text/html; charset=windows-1252" http-equiv="Content-Type" />
<title>Senza nome 1</title>
<link href="sfondo tutta pagina.css" rel="stylesheet" type="text/css" />
<!--[if lt IE 7]>
<script type="text/javascript" src="mootools-core-1.3-full-compat.js"></script>
<![endif]-->
</head>
<body>
<div id="bg">
<div>
<table cellspacing="0" cellpadding="0">
<tr>
<td>
[img]sfondo-ocra.png[/img]
</td>
</tr>
</table>
</div>
</div>
<div id="container">
<div id="tastiera">
<object id="flash1" data="TASTIERA%20SITO.swf" style="width: 147px; height: 397px; z-index: 5" type="application/x-shockwave-flash">
<param name="movie" value="TASTIERA%20SITO.swf" />
<param name="quality" value="High" />
<param name="wmode" value="transparent" />
</object>
</div>
</div>
<div id="center">[img]5.jpg[/img]
</div>
</body>
</html>
Codice css
* {
margin: 0;
padding: 0;
}
html, body, #bg, #bg table, #bg td {
height:100%;
width:100%;
overflow:hidden;
}
#bg {
position: fixed;
}
#bg div {
height:200%;
left:-50%;
position:absolute;
top:-50%;
width:200%;
z-index:1
}
#bg td {
text-align:center;
vertical-align:middle;
}
#bg img {
margin:0 auto;
min-height:50%;
min-width:50%;
}
#center{
border: thick #000000 double;
width: 800px;
height: 599px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -400px;
margin-top: -300px;
text-align: center;
z-index: 4;
}
#tastiera{
border: thick #000000 double;
width: 150px;
height: 400px;
margin-left:0px;
z-index: 6;
}
#container{
width: 150px;
height: 400px;
position: absolute;
margin-left: -200px;
margin-top: -400px;
z-index: 5;
}
Grazie per la pazienza.
Ciao
Rispondi quotando