Salve a tutti, sto creando da zero un sito e ho riscontrato il seguente problema:
Ho creato un foglio di stile per ogni sezione!
Ne ho uno per l'Header, uno per la Barra dei Menu, uno per il Contenuto e uno per il Footer!
Il problema è sorto quando sono andato a creare dei css nel file Contenuto.css!
Nel file BarraMenu.css ho:
codice:
html, body
{
width: 100%;
height: 100%;
font-family: Verdana, Arial, Helvetica;
font-size: 16px;
background-color: #bbffcb;
margin: 0;
padding: 0;
color: #000000;
}
#Menu {
margin: 3em auto;
width: 54.75em;
height: 3em;
background: #cd97f3;
background: -moz-linear-gradient(100% 100% 90deg, #ebcffe, #cd97f3);
background: -webkit-gradient(linear, left top, left bottom, from(#ebcffe), to(#cd97f3));
border: 0.125em solid #ffffff;
border-top-left-radius: 15px;
border-bottom-right-radius: 15px;
}
ul#MenuBarra {
font-family: Verdana, sans-serif;
font-size: 0.75em;
margin: 0 0 0 15em;
padding: 0;
list-style: none;
}
ul#MenuBarra li {
position: relative;
display: block;
width: 10em;
height: 4em;
float: left;
border-right: 0.125em solid #000000;
border-left: 0.125em solid #000000;
}
ul#MenuBarra li a {
position: absolute;
width: 10em;
height: 3.2em;
padding-top: 0.8em;
color: #ffffff;
display: block;
font-weight: bold;
line-height: 2.2em;
text-decoration: none;
text-align: center;
}
ul#MenuBarra li.active, ul#MenuBarra li:hover {
width: 10em;
height: 4em;
background: #cd97f3;
background: -moz-linear-gradient(100% 100% 90deg, #dbadfc, #aa43f2);
background: -webkit-gradient(linear, left top, left bottom, from(#dbadfc), to(#aa43f2));
}
Poi nel file Contenuto.css ho messo:
codice:
#Contenuto {
margin: -3em auto;
width: 55em;
height: 40em;
background: #ffffff;
}
l'HTML riguardante questa parte è il seguente:
Ma quando faccio un'anteprima, il #Contenuto si va a sovrapporre al #Menu.
Allora ho aggiunto in #Menu{} il comando " z-index: 1; ", ma niente!
Così ho messo il #Contenuto dentro il file BarraMenu.css, ma non è cambiato comunque nulla.
Come mai?
Vi sarei grato se mi deste una mano ^^
Grazie anticipatamente!