Qual é minha questão:
Olá Caros Usuarios da Forumeiros Então queria saber como deixar minha legenda de grupos assim com o efeito 



Por Favor Amigos Me Ajudem 

Endereço do meu fórum:
http://nxfatal.forumeiros.com

Versão do fórum:
PUNBB

Olá,

Queira indicar o endereço do fórum no qual viu este efeito.

Até mais.

Claro. \/
http://lk-nwd.forumeiros.com/

Aceda à 'Folha de estilo CSS':
Painel de Controle ->> Visualização ->> Imagens e Cores ->> Cores / Folha de estilo CSS

Acrescente o código a seguir na folha:

Código:

#i_whosonline + p br + br + em {
background: url(http://i41.servimg.com/u/f41/17/41/76/40/grey-u10.png) repeat-x scroll left bottom #fff;
border: 2px solid #ddd;
border-radius: 6px 6px 6px 6px;
color: transparent;
display: block;
font-size: 0;
font-weight: 700;
margin: 0 auto;
padding: 10px 8px 5px 5px;
text-align: center!important;
text-shadow: 0 0 5px #d0f;
width: 61%!important;
}
#i_whosonline + p br + br + em a:hover {
background: #DDD;
padding: 9px 10px 10px;
}
#i_whosonline + p br + br + em a {
-webkit-transition-duration: .3s;
border-bottom: 1px solid #d4d6d5;
font-size: 15px;
font-style: normal;
font-weight: 700;
margin: 0 5px;
text-shadow: 0 1px 1px #4eee94;
}

Valide!

Resulta?

Atenciosamente, Harker.

Ai Não Funfo Mano.
Lembrando Meu Fórum e PUNBB.

Boa tarde,

Altere por este o código passado pelo nosso amigo Harker:

Código:

#onlinelist p {
background: url(http://i41.servimg.com/u/f41/17/41/76/40/grey-u10.png) repeat-x scroll left bottom #fff;
border: 2px solid #ddd;
border-radius: 6px 6px 6px 6px;
color: transparent;
display: block;
font-size: 0;
font-weight: 700;
margin: 0 auto;
padding: 10px 8px 5px 5px;
text-align: center!important;
text-shadow: 0 0 5px #d0f;
width: 61%!important;
}
#onlinelist p:hover {
background: #DDD;
padding: 9px 10px 10px;
}
#onlinelist p {
-webkit-transition-duration: .3s;
border-bottom: 1px solid #d4d6d5;
font-size: 15px;
font-style: normal;
font-weight: 700;
margin: 0 5px;
text-shadow: 0 1px 1px #4eee94;
}

Abraços,
Sennior.

Saudações!

Substitua o código atual por este:

Código:

#onlinelist a.gensmall{background:url(http://i41.servimg.com/u/f41/17/41/76/40/grey-u10.png) repeat-x scroll left bottom #fff;border:2px solid #ddd;border-radius:6px 6px 6px 6px;color:transparent;display:block;font-size:0;font-weight:700;margin:0 auto;padding:10px 8px 5px 5px;text-align:center!important;text-shadow:0 0 5px #d0f;width:61%!important}#onlinelist .legend p a{-webkit-transition-duration:.3s;border-bottom:1px solid #d4d6d5;font-size:15px;font-style:normal;font-weight:700;margin:0 5px;text-shadow:0 1px 1px #4eee94}#onlinelist .legend p a:hover{background:#DDD;padding:9px 10px 10px}

Atenciosamente.

Sennior Olha Como Fico o seu Code

Dokyo Olha como fico o seu Code

Olá,

Peço ao senhor que acede à:
Painel de Controle Visualização Templates Geral index_body
Procura por:

Código:

<p>{LEGEND} : {GROUP_LEGEND}</p>

Substitua por:

Código:

<div id="caixa"><p>{LEGEND} : {GROUP_LEGEND}</p></div>

Depois acede à:
Painel de Controle Visualização Imagens e Cores Cores Folha de estilo CSS

Código:

#caixa {
width: 70%;
background: white url(http://i44.servimg.com/u/f44/15/34/61/11/grey-u10.png) repeat-x scroll left bottom;
border: 2px solid #DDD;
border-radius: 6px;
text-align: center;
padding: 10px 8px 5px 5px;
display: block;
margin: 0 auto;
color: transparent;
}
#onlinelist .gensmall:hover {
background: #DDD;
padding: 12px 10px 7px
}

Valide.


Até mais.

Saudações!

Para retirar os colchetes da legenda, adicione na tua CSS este código:

Código:

#gensmall {font-size:0px}#main-content em::before{content:'Legenda: ';font-size:12px;font-style:normal} #main-content em b *{font-size:12px;font-style:normal}#main-content em b a::before{content:' • '}#main-content em b:first-child a::before{content:''}#main-content em,#main-content em *:link{cursor:default;color:inherit}

Atenciosamente.

Nem um dos dois Funciono

iPauliinhoO_. escreveu:Nem um dos dois Funciono

Olá novamente,

Visitei o seu fórum e vi que o senhor não fez as modificação no template que eu lhe pedir, poderia fazer as editações?


Até mais.

Mano Eu Não Achei o

Código:

<p>{LEGEND} : {GROUP_LEGEND}</p>

no Index_body

Olá novamente,

Senhor a variável

Código:

<p>{LEGEND} : {GROUP_LEGEND}</p>

se encontra no template index_body na linha 84.
Tenta procurar na busca no template.


Até mais.

Funciono Mais tipo quando você coloca o Mouse em Cima ele Não Aproxima ele fika normal

Olá,

Ele não se aproxima porque existe só um grupo, tente colocar alguns outros grupos e ver se resulta.


Até mais.

Saudações!

O senhor diz que ao posicionar o rato acima do nome do grupo, não aparece o link de tal, é isto?

Atenciosamente.

Olá , Adicione Esse Codigo Em Seu CSS.

Painel De Controle > Visualização > Imagens e Cores > Cores Folha De Estilo CSS:

Código:


#i_whosonline + p br + br + em{width: 70%; background: white url(http://i41.servimg.com/u/f41/17/41/76/40/grey-u10.png) repeat-x scroll left bottom; border: 2px solid #DDD; border-radius: 6px; text-shadow: 0px 0px 5px #DD00FF; text-align:center; padding: 10px 8px 5px 5px; display: block; font-weight: bold; margin: 0 auto; font-size: 0px; color: transparent; } #i_whosonline + p br + br + em a{-webkit-transition-duration: .3s; text-shadow: 0px 1px 1px #4EEE94; font-size: 15px; margin: 0 5px; font-style: normal; border-bottom: 1px solid #d4d6d5; font-weight: bold} #i_whosonline + p br + br + em a:hover{background-color: grey; text-decoration:underline; border: 1px solid #000000; padding: 9px 10px 10px; text-shadow: 0px 1px 1px #4EEE94}


Cordialmente PixelBR (alysson789) :3