Fórum dos Fóruns

Fórum dos Fóruns Forumeiros

Welcome FdF Bem-vindo ao fórum de suporte Forumeiros  Muito feliz


Para aproveitar tudo o que o nosso fórum lhe oferece, agradecemos que se identifique, se já é nosso membro, ou que se junte à nossa comunidade, fazendo o seu registo.
Acesso rápido

Fóruns de suporte oficiais


Meriteiro

Outubro de 2016



"Este membro destacou-se pela sua dedicação e pelo seu esforço.
Ao longo do último mês, demonstrou as suas capacidades gerais no FDF e, por isso, merece o nosso agradecimento."
Login

Esqueci minha senha

Últimos assuntos
Perdi minha senha!
Obter senha

Nota: use se tiver perdido acesso ao seu painel de controle.

Últimas sugestões
Parceiros Forumeiros
Quem está conectado
68 usuários online :: 2 usuários cadastrados, Nenhum Invisível e 66 Visitantes :: 1 Motor de busca

Kyo Panda, YouTube3

[ Ver toda a lista ]


O recorde de usuários online foi de 3131 em Qui 24 Dez 2009 - 15:05

Menu Estilo ao do FdF

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

Resolvido Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 16:02

Detalhes da questão


Endereço do fórum: http://fairytailcelestial.forumeiros.com
Versão do fórum: PhpBB3

Descrição


Oi pessoal,

Gostaria de um menu no estilo ao do FdF.
Porém, com a fonte Sans-serif se possível.

Obrigado pela atenção, abraços o/

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues
  • 0

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Fraise em Dom 4 Out 2015 - 16:05

Olá!

Adicione à sua folha de estilos:
Código:
#page-header .navbar .linklist {
    background: #2D3134;
    border: none;
    margin: -9px -10px 0;
}
ul.navlinks {
    border-bottom: 1px solid #fff;
    font-weight: 700;
    text-align: center;
}
ul.linklist li {
    display: inline;
    font-size: 1.1em;
    line-height: 2.2em;
    list-style-type: none;
    width: auto;
}
#page-header .navbar .linklist:hover {
border-bottom:1px solid #369FCF;
}

Até mais.


Fraise
Super usuário

Masculino
Inscrito dia : 26/06/2015
Mensagens : 4973
Pontos Ativos : 7154

http://ajuda.forumeiros.com/ https://twitter.com/@FraiseFdF

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 16:19

O menu ficou com a altura pequena e os links estão vermelhos.

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Dom 4 Out 2015 - 16:27

Saudações!

Adicione mais este código CSS:
Código:
a.mainmenu {
    background: url(http://i18.servimg.com/u/f18/18/45/41/65/nav10.png) repeat-x 0 45px;
    color: #FFF;
    display: inline-block;
    font-family: "Trebuchet MS", Arial, Verdana, Sans-serif;
    font-size: 13px;
    font-weight: 700;
    height: 45px;
    line-height: 45px;
    padding: 0 12px;
    transition: 250ms;
}

Até mais.
Sennior


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 16:47

Ótimo!

Mas tem aquela borda azul espessa que aparece abaixo de cada menu ao clicar aqui no FdF.
No meu fórum ela fica estreita e também, em todo o menu em vez de apena abaixo do link do menu.

Abraços o/

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Dom 4 Out 2015 - 16:52

Adicione mais este código:
Código:
a.mainmenu:hover {
    border-bottom: 4px solid #0372be;
}

Resulta?
Abraços.
Sennior


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 17:19

Perfeito!
Muito bom mesmo.

Ei, eu percebi uma diferença. O menu da FdF, ele vai de uma ponta do quadro intermediário até a outra.
Consegue um código pra fazer isso?

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Dom 4 Out 2015 - 17:21

Saudações!

Acima de todos os códigos CSS, adicione este:
Código:
#page-header .navbar .linklist {margin: -9px -16px 0!important;}

Salve e visualize.
Até mais.


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 17:27

O menu sumiu Em choque

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Dom 4 Out 2015 - 17:30

Boas,

Normal Rindo , Mande-nos o teu CSS e retire o código que eu mandei você pôr.
Até mais.
Sennior


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 17:38

Está aqui.

Código:
#search-box {
  display: none;
}
 
#chatbox_header {
background: #dd6666;
border-top: 1.5px solid lightgray;
border-left: 1.5px solid lightgray;
border-right: 1.5px solid lightgray;
}
 
h2.chatbox-title a.chat-title {
text-align: center;
text-transform: uppercase;
font-family: Trebuchet MS;
}
 
#chatbox_main_options a {
border: 1.5px solid lightgray;
background: #cc3333;
color: white;
font-family: Trebuchet MS;
padding: 3px;
}
 
#chatbox_footer  {
background:#dd6666;
border-bottom: 1.5px solid lightgray;
border-right: 1.5px solid lightgray;
border-left: 1.5px solid lightgray;
}
 
#wrap {
border: 1.5px solid lightgray;
width: 96%;
}
 
#left .module .h3 {
    background: #DD6666;
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.247) inset, 0 1px 3px rgba(0,0,0,0.298), 0 2px 0 rgba(255,255,255,0.2) inset;
    color: #FFF!important;
    cursor: default!important;
    font-family: Arial;
    font-size: 10px;
    font-style: normal;
    font-variant: normal;

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 17:40

Aqui está o resto.
Código:

#left .module {
  border: 1.5px solid lightgray;
  background: #FAFAFA;
}
 
.forabg {
padding-left: 0px;
padding-right: 0px;
padding-bottom: -10pxx;
border: 1.5px solid lightgray;
background: #dd6666;
}
 
li.row {
border-bottom: 1.5px solid lightgray;
border-top: 1.5px solid lightgray;
border-left: none;
border-right: none;
background: #fafafa;
}
 
ul.navlinks {
    border-bottom: 1px solid #fff;
    font-weight: 700;
    text-align: center;
}
 
ul.linklist li {
    display: inline;
    font-size: 1.1em;
    line-height: 2.2em;


Desculpe mas estou usando celular  Rindo

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Dom 4 Out 2015 - 18:24

Saudações!

Altere por este:
Código:
.navbar {
    background-color: #2D3134!important;

}
.navbar {
    width: auto!important;
    margin-left: -6px!important;
    margin-right: -6px!important;
    left: 0!important;
    right: 0!important;
}
ul.navlinks {
    border-bottom: transparent!important;
    font-weight: 700;
    text-align: center;
}
#search-box {
  display: none;
}
 
#chatbox_header {
background: #dd6666;
border-top: 1.5px solid lightgray;
border-left: 1.5px solid lightgray;
border-right: 1.5px solid lightgray;
}
 
h2.chatbox-title a.chat-title {
text-align: center;
text-transform: uppercase;
font-family: Trebuchet MS;
}
 
#chatbox_main_options a {
border: 1.5px solid lightgray;
background: #cc3333;
color: white;
font-family: Trebuchet MS;
padding: 3px;
}
 
#chatbox_footer  {
background:#dd6666;
border-bottom: 1.5px solid lightgray;
border-right: 1.5px solid lightgray;
border-left: 1.5px solid lightgray;
}
 
#wrap {
border: 1.5px solid lightgray;
width: 96%;
}
 
#left .module .h3 {
    background: #DD6666;
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.247) inset, 0 1px 3px rgba(0,0,0,0.298), 0 2px 0 rgba(255,255,255,0.2) inset;
    color: #FFF!important;
    cursor: default!important;
    font-family: Arial;
    font-size: 10px;
    font-style: normal;
    font-variant: normal;

#left .module {
  border: 1.5px solid lightgray;
  background: #FAFAFA;
}
 
.forabg {
padding-left: 0px;
padding-right: 0px;
padding-bottom: -10pxx;
border: 1.5px solid lightgray;
background: #dd6666;
}
 
li.row {
border-bottom: 1.5px solid lightgray;
border-top: 1.5px solid lightgray;
border-left: none;
border-right: none;
background: #fafafa;
}
 
ul.navlinks {
    border-bottom: 1px solid #fff;
    font-weight: 700;
    text-align: center;
}
 
ul.linklist li {
    display: inline;
    font-size: 1.1em;
    line-height: 2.2em;

Até mais.


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 18:57

O CSS nao está funcionando.

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Dom 4 Out 2015 - 19:00

Saudações!

Amigo, esta pelo celular? Seria bom se fizesse essas alterações no computador.
Altere novamente o código:
Código:
.navbar {
    background-color: #2D3134!important;

}
a.mainmenu:hover {
    border-bottom: 4px solid #0372be;
}
a.mainmenu {
    background: url(http://i18.servimg.com/u/f18/18/45/41/65/nav10.png) repeat-x 0 45px;
    color: #FFF;
    display: inline-block;
    font-family: "Trebuchet MS", Arial, Verdana, Sans-serif;
    font-size: 13px;
    font-weight: 700;
    height: 45px;
    line-height: 45px;
    padding: 0 12px;
    transition: 250ms;
}
.navbar {
    width: auto!important;
    margin-left: -6px!important;
    margin-right: -6px!important;
    left: 0!important;
    right: 0!important;
}
ul.navlinks {
    border-bottom: transparent!important;
    font-weight: 700;
    text-align: center;
}
#search-box {
  display: none;
}
 
#chatbox_header {
background: #dd6666;
border-top: 1.5px solid lightgray;
border-left: 1.5px solid lightgray;
border-right: 1.5px solid lightgray;
}
 
h2.chatbox-title a.chat-title {
text-align: center;
text-transform: uppercase;
font-family: Trebuchet MS;
}
 
#chatbox_main_options a {
border: 1.5px solid lightgray;
background: #cc3333;
color: white;
font-family: Trebuchet MS;
padding: 3px;
}
 
#chatbox_footer  {
background:#dd6666;
border-bottom: 1.5px solid lightgray;
border-right: 1.5px solid lightgray;
border-left: 1.5px solid lightgray;
}
 
#wrap {
border: 1.5px solid lightgray;
width: 96%;
}
 
#left .module .h3 {
    background: #DD6666;
    box-shadow: 0 0 2px 0 rgba(0,0,0,0.247) inset, 0 1px 3px rgba(0,0,0,0.298), 0 2px 0 rgba(255,255,255,0.2) inset;
    color: #FFF!important;
    cursor: default!important;
    font-family: Arial;
    font-size: 10px;
    font-style: normal;
    font-variant: normal;

#left .module {
  border: 1.5px solid lightgray;
  background: #FAFAFA;
}
 
.forabg {
padding-left: 0px;
padding-right: 0px;
padding-bottom: -10pxx;
border: 1.5px solid lightgray;
background: #dd6666;
}
 
li.row {
border-bottom: 1.5px solid lightgray;
border-top: 1.5px solid lightgray;
border-left: none;
border-right: none;
background: #fafafa;
}
 
ul.navlinks {
    border-bottom: 1px solid #fff;
    font-weight: 700;
    text-align: center;
}
 
ul.linklist li {
    display: inline;
    font-size: 1.1em;
    line-height: 2.2em;

Abraços.
Sennior


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 19:03

Desculpe, mas eu utilizo apenas celular atualmente. 
Aí fica difícil.


Última edição por Cloud' em Dom 4 Out 2015 - 19:12, editado 1 vez(es)

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Dom 4 Out 2015 - 19:07

Saudações,

Alterou o código CSS como eu pedi?
Houve alterações?

Até mais.
Sennior


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Dom 4 Out 2015 - 19:50

Ótimo!!!

Mas também personalizou os links do rodapé huh
Porém a cor dos links estão vermelhos.

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Dom 4 Out 2015 - 20:28

Coloque o código abaixo no inicio de teu CSS:
Código:
ul.linklist.clearfix a {
    color: white;
}

Até mais.
Sennior


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Cloud' em Seg 5 Out 2015 - 3:25

Perfeito!
Pó de fechar o tópico Positivo

Cloud'
Usuário destaque

Masculino
Inscrito dia : 09/03/2014
Mensagens : 905
Pontos Ativos : 2481

http://fairytailcelestial.forumeiros.com https://www.facebook.com/liuquen.rodrigues

Resolvido Re: Menu Estilo ao do FdF

Mensagem por Sennior em Seg 5 Out 2015 - 18:16

Questão marcada como Resolvida ou o Autor solicitou que ela fosse arquivada.
Tópico marcado como Resolvido e movido para Questões resolvidas.


Admineiros Jamais forneça seus dados pessoais, tais como e-mail de fundação ou senhas pelo fórum!
Admineiros  Antes de criar um novo tópico faça uma pesquisa rápida e olhe a lista de tutoriais prontos.
Admineiros Perdeu a senha de administração? Veja o que fazer.
Admineiros Ferramentas do Administrador.

"Você será lembrado pelo que faz, e não pela cor que tens".

Sennior
Admineiro
Admineiro

Masculino
Inscrito dia : 10/06/2011
Mensagens : 16227
Pontos Ativos : 22709

http://ajuda.forumeiros.com/forum https://www.facebook.com/GlladstonHenrique

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
Fórum dos Fóruns - Ajuda mútua para usuários forumeiros
on
Fórum grátis: interajuda aos usuários forumeiros. Criar e administrar um fórum. Descubra nossos guias, tutoriais e astúcias no suporte de Forumeiros.
Votações: 5