JaXs Designer

Olá!

O problema que o teu menu está a ter é normal acontecer, principalmente com "DIV's".

Mas tudo tem solução e esta espero que resulte!

Ora, o teu menu está dentro de uma div, certo?
O slider também poderá estar dentro de uma div, ou não, mas caso esteja ainda é mais fácil.

A solução é ir ao CSS e no id que corresponde à div do menu colocar a propriedade "z-index: x;". Porque?
o z-index é uma propriedade para distinguir qual das div's ficam sobrepostas, e em que posição.
Imagina que crias 3 div's, cada uma com uma cor diferente, com uma cor aleatória, e que ficarão nesta posição que vou dar de exemplo.


O que acontece aqui?
o id do css para estas 3 div's deveriam ser assim:

#camada1 {
background-color: #000;
margin-top: 0px;
margin-left: 0px;
width: 100px;
height: 100px;
position: absolute;
z-index: 1;
}

#camada2 {
background-color: #FF0;
margin-top: 50px;
margin-left: 50px;
width: 100px;
height: 100px;
position: absolute;
z-index: 2;
}

#camada3 {
background-color: #00F;
margin-top: 100px;
margin-left: 100px;
width: 100px;
height: 100px;
position: absolute;
z-index: 3;
}

O que acabei de fazer, e tentar explicar-te é que em cada id para cada div consta a propriedade "z-index". O que ela faz? ela ordena a sobreposição de cada camada, ou seja, uma camada(div) irá ficar sobreposta noutra se o seu número for maior que a anterior. Como na imagem acima a div com fundo preto tem z-index: 1, logo a 2ª div, que tem z-index: 2 irá ficar por cima da camada 1, visto que tem um numero no z-index mais elevado.

Então, para finalizar, o que terás de fazer, é colocar na id da div do menu a propriedade z-index com um valor maior que o valor do slider que também terás de acrescentar o z-index neste!

Exemplo:
#menu {
z-index: 4;
}

#slider {
z-index: 3;
}



Espero que percebas e tenha ajudado.

Boa Sorte com a Copa!