Menu superior

Ver o tópico anterior Ver o tópico seguinte Ir em baixo

Resolvido Menu superior

Mensagem por Mauricio Molina em 24/10/12, 06:29 pm

Qual é minha questão:
Ola...

Estou com este código que colocar uma barra de menu superior, mas estou com dificuldades de editar correto, eu quero que a barra fique no canto superior direito, rente com o quadrado do fórum:

tem o JS também, mas acho que não seja necessário...

Código:
/***Menu superior**/
#conectFor * {
font-size: 12px;
}
#conectFor{
padding: 13px;
padding-right : 20px;
text-align: right; /***posição do texto barra, esquerda***/
background: #DAE1E6; /** cor fundo barra**/
border-bottom: 1px solid #918C8C;
font: 15px Tahoma;
height: 10px;
display: block;
color: #ED1111;
position: relative;
top: 0;
left: 0;
right: 0;
}
#conectFor a{
color:#0A0A0A; /** cor letra barra**/
font-family:Arial;
padding:8px 5px ;
margin:0 1px;
text-decoration:none;
}
#conectFor a:hover{
color:#111;
border-radius:5px 5px 0 0;
-moz-border-radius:5px 5px 0 0;
-webkit-border-radius:5px 5px 0 0;
-o-border-radius:5px 5px 0 0;
background:#f1f1f1;
}
#conectFor a:hover ul{display:inline;}
#conectFor ul {
margin-top: -1px;
z-index:1;
border-radius: 0px 0px 5px 5px;
-moz-border-radius: 0px 0px 5px 5px;
-webkit-border-radius: 0px 0px 5px 5px;
-o-border-radius: 0px 0px 5px 5px;
box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
-moz-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
-o-box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
top: 100%;
width: 390px;
padding:20px 13px;
color: #333;
background: #F1F1F1 url(http://imageshack.us/a/img268/2599/letreiro.png) no-repeat bottom right;
list-style: none;
display: none;
float: left;
right: 0em;
position: absolute;
}
#conectFor ul li{
float: left;
width: 47%;
display: inline;
text-align:left;
margin:5px;
}
#conectFor ul li a{color:#3689D1; background-image:none !important;}
#conectFor ul li a:hover{color:#111; background:transparent;}

#conectFor a[href="/profile?mode=editprofile"] {
background-position: right;
background-repeat: no-repeat;
padding-right: 10px;
background-image: url(http://i42.servimg.com/u/f42/17/32/13/00/dropdo10.png);
}

#conectFor a[href="/profile?mode=editprofile"]:hover {
  background-image: url(http://i42.servimg.com/u/f42/17/32/13/00/dropdo11.png);}

#conectFor {
top: 5px;
width: 20%; /***tamanho barra***/
left: 900px;/***posição barra***/
}
/***Menu superior***/

Com este código que esta no final do CSS acima, eu consigo, mas quando coloco left ele fica a direita, mas me falaram que a página esta muito grande, passando do limite....

Estanho quando coloco reght ele fica no canto esquerdo...

Código:
#conectFor {
top: 5px;
width: 20%; /***tamanho barra***/
left: 1193px;/***posição barra***/
}

Alguém pode me ajudar?

Obrigado!

Links e imagens do meu problema:
Não é necessário.

Endereço do meu fórum:
http://aquapeixes.forumeiros.com/forum.htm

Versão do meu fórum:
PHPBB3
avatar

Mauricio Molina
Usuário destaque

Masculino
Inscrito dia : 22/09/2009
Mensagens : 988
Pontos Ativos : 1422

Ver perfil do usuário http://aquapeixes.forumeiros.com/forum.htm

Resolvido Re: Menu superior

Mensagem por Luciano98 em 24/10/12, 07:26 pm

Olá!

Sugiro que utilize esse código CSS:
Código:
#conectFor{-webkit-border-horizontal-spacing: 6px;
-webkit-border-image: none;
-webkit-border-vertical-spacing: 6px;
-webkit-box-shadow: #353535 0px 0px 8px 0px;
background-attachment: scroll;
background-color: white;
background-image: -webkit-linear-gradient(top, white, #F2F2F2);
border-bottom-color: #C4C4C4;
border-bottom-left-radius: 7px;
border-bottom-right-radius: 7px;
border-bottom-style: solid;
border-bottom-width: 1px;
border-collapse: separate;
border-left-color: #C4C4C4;
border-left-style: solid;
border-left-width: 1px;
border-right-color: #C4C4C4;
border-right-style: solid;
border-right-width: 1px;
border-top-color: #C4C4C4;
border-top-left-radius: 0px;
border-top-right-radius: 0px;
border-top-style: solid;
border-top-width: 1px;
box-shadow: #353535 0px 0px 8px 0px;
color: #666;
cursor: url(http://img24.imageshack.us/img24/7129/glovecursor.png), progress;
display: block;
float: right;
font-family: Arial, Geneva, Helvetica, Verdana, sans-serif;
font-size: 13px;
height: 25px;
left: 75%;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 20px;
margin-top: 0px;
padding-bottom: 0px;
padding-left: 10px;
padding-right: 0px;
padding-top: 6px;
position: fixed;
text-align: center;
text-decoration: none;
top: 0%;
vertical-align: middle;
white-space: nowrap;
width: 296px;
z-index: 1;
font-weight: bold;}

Até mais.
avatar

Luciano98
Principal contribuidor
Principal contribuidor

Masculino
Inscrito dia : 01/09/2010
Mensagens : 7648
Pontos Ativos : 11045

Ver perfil do usuário http://ajuda.forumeiros.com

Resolvido Re: Menu superior

Mensagem por Mauricio Molina em 25/10/12, 03:30 pm

Valeu luciano, assim que possível retorno com o resultado, pois esta me dando auxilio em um código JS, para isso precisei desativar todos os outros, incluindo este que contribui com o menu...

Até mais...
avatar

Mauricio Molina
Usuário destaque

Masculino
Inscrito dia : 22/09/2009
Mensagens : 988
Pontos Ativos : 1422

Ver perfil do usuário http://aquapeixes.forumeiros.com/forum.htm

Ver o tópico anterior Ver o tópico seguinte Voltar ao Topo

- Tópicos similares

Permissão deste fórum:
Você não pode responder aos tópicos neste fórum