Botões na parte superior do fórum

[Nosferatu~]

Qual é minha questão:
Gostaria de saber como adicionar os botões de " Entrar " e " Registar "
Na Parte superior do fórum 








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

Versão do fórum:
INVISION

[Hancki]

Olá!

Poderia dar-me um exemplo mais específico? Um fórum onde tenha visto isso ou então a localização exata de onde deseja. Mostre isso por imagens.

Hancki

[Konai]

Saudações meu caro!

Hancki, o efeito que ele deseja é aqueles botões entrar e registrar-se na parte superior do fórum, porém só é possível fazer este efeito(creio eu) por edições via templates! Só que temos um porém, pois apenas duas versões podem fazer modificações em templates, aos quais são: PunBB e PhpBB2! Eu lamento!  

Cordiais saudações!

[JScript]

@Nemo~

Olá amigo, o que você deseja já tem no fórum que informou, porém não no formato de botões, veja:


Mas então, deseja transformar os links da barra em botões?
Se sim, entre no painel de controle de seu fórum e vá em Visualização -> Imagens e cores -> Cores, selecione a aba Folha de estilos CSS e adicione o código abaixo:

Código:


#fa_right .rightHeaderLink:nth-of-type(1) {
  background-color: #FF0000;
  border: 1px solid;
  border-radius: 4px 4px 4px 4px;
  color: rgba(0, 0, 0, 0);
  letter-spacing: -999px;
  margin-right: 10px;
  padding-left: 10px;
  padding-right: 10px;
}
#fa_right .rightHeaderLink:nth-of-type(1):before {
  color: #FFFFFF;
  content: "Entrar";
  display: block;
  letter-spacing: normal;
  margin-bottom: -32px;
}
#fa_right .rightHeaderLink:nth-of-type(2) {
  background-color: #FF0000;
  border: 1px solid;
  border-radius: 4px 4px 4px 4px;
  color: rgba(0, 0, 0, 0);
  letter-spacing: -999px;
  margin-right: 10px;
  padding-left: 10px;
  padding-right: 10px;
}
#fa_right .rightHeaderLink:nth-of-type(2):before {
  color: #FFFFFF;
  content: "Registra-se";
  display: block;
  letter-spacing: normal;
  margin-bottom: -32px;
}


Resultado:


Abraços,

JS

[Nosferatu~]

Funcionou mas gostaria se possível inserir imagens

E Ocultar a barra da Forumeiros

[JScript]

Nota: Sempre que possível, especifique tudo o que deseja em relação a sua questão ok? Isso não significa que poderá postar mais de uma questão por tópico!

---

Troque todo o código que postei por este abaixo:

Código:


body {
  margin-top: 0 !important;
}
#fa_toolbar {
  margin-top: -30px !important;
}
#fa_right .rightHeaderLink:nth-of-type(1) {
  background: url("http://ENDEREÇO_DA_IMAGEM") no-repeat scroll center top #FF0000;
  border: 1px solid;
  border-radius: 4px 4px 4px 4px;
  color: rgba(0, 0, 0, 0);
  letter-spacing: -999px;
  margin-right: 10px;
  margin-top: 32px;
  padding-left: 10px;
  padding-right: 10px;
}
#fa_right .rightHeaderLink:nth-of-type(1):before {
  color: #FFFFFF;
  content: "Entrar";
  display: block;
  letter-spacing: normal;
  margin-bottom: -32px;
}
#fa_right .rightHeaderLink:nth-of-type(2) {
  background: url("http://ENDEREÇO_DA_IMAGEM") no-repeat scroll center top #FF0000;
  border: 1px solid;
  border-radius: 4px 4px 4px 4px;
  color: rgba(0, 0, 0, 0);
  letter-spacing: -999px;
  margin-right: 10px;
  margin-top: 32px;
  padding-left: 10px;
  padding-right: 10px;
}
#fa_right .rightHeaderLink:nth-of-type(2):before {
  color: #FFFFFF;
  content: "Registra-se";
  display: block;
  letter-spacing: normal;
  margin-bottom: -32px;
}


Obs.: Troque no código acima http://ENDEREÇO_DA_IMAGEM pelo endereço da imagem que deseja utilizar em cada botão!

Resultado:


Abraços,

JS

[Nosferatu~]

Ola, não funcionou aqui.


Gostaria que ficasse somente a imagem... 

*Peço desculpas por não esclarecer antes*

[Konai]

Saudações autor!

Substitua o código fornecido pelo o nosso grande Ajudeiro JScript por este:

Código:

body {
  margin-top: 0 !important;
}
#fa_toolbar {
  margin-top: -30px !important;
}
#fa_right .rightHeaderLink:nth-of-type(1) {
  background-image: url(http://i.imgur.com/z1W2bJR.jpg) !important;;
  border: 1px solid;
  border-radius: 4px 4px 4px 4px;
  color: rgba(0, 0, 0, 0);
  letter-spacing: -999px;
  margin-right: 10px;
  margin-top: 30px;
  padding-left: 10px;
  padding-right: 10px;
}
#fa_right .rightHeaderLink:nth-of-type(1):before {
  color: #FFFFFF;
  content: "Entrar";
  display: block;
  letter-spacing: normal;
  margin-bottom: -32px;
}
#fa_right .rightHeaderLink:nth-of-type(2) {
  background-image: url(http://i.imgur.com/SfApqdK.jpg) !important;
  border: 1px solid;
  border-radius: 4px 4px 4px 4px;
  color: rgba(0, 0, 0, 0);
  letter-spacing: -999px;
  margin-right: 10px;
  margin-top: 30px;
  padding-left: 10px;
  padding-right: 10px;
}
#fa_right .rightHeaderLink:nth-of-type(2):before {
  color: #FFFFFF;
  content: "Registra-se";
  display: block;
  letter-spacing: normal;
  margin-bottom: -32px;
}

Não se esqueça de salvar!

Cordiais saudações!

[JScript]

@Dokyo
Você testou o código e viu o resultado? Se não viu, aqui está:


Não mudou nada além da cor, e o que o autor deseja é que fique somente a imagem, nada de nomes!

---

@Nemo~
Poste aqui as imagens que você deseja e faremos o código de acordo ok?

Até mais,

JS

[Nosferatu~]

Ola, Dokyo! 
Obrigado pela ajuda porem ainda não funcionou   

Resultado:



Gostaria que ficasse assim: 


@Edit
Imagens: 

[JScript]

@Nemo~

Leia: https://ajuda.forumeiros.com/t89159-botoes-na-parte-superior-do-forum#605532

JS

[Nosferatu~]

Ola, você quer a imagem dos botões ?
Caso seja isso,eu já havia postado acima   .

[Konai]

Autor, substitua todos os códigos fornecidos neste tópico por este:

Código:

body {
margin-top: 0 !important;
}
#fa_toolbar {
margin-top: -30px !important;
}
#fa_right .rightHeaderLink:nth-of-type(1) {
background-image: url(http://i.imgur.com/z1W2bJR.jpg) !important;
background-repeat: no-repeat !important;
width: 79px !important;
height: 73px !important;
border: 1px solid;
border-radius: 4px 4px 4px 4px;
color: rgba(0, 0, 0, 0);
letter-spacing: -999px;
margin-right: 10px;
margin-top: 30px;
padding-left: 10px;
padding-right: 10px;
}
#fa_right .rightHeaderLink:nth-of-type(2) {
background-image: url(http://i.imgur.com/SfApqdK.jpg) !important;
background-repeat: no-repeat !important;
width: 117px !important;
height: 73px !important;
border: 1px solid;
border-radius: 4px 4px 4px 4px;
color: rgba(0, 0, 0, 0);
letter-spacing: -999px;
margin-right: 10px;
margin-top: 30px;
padding-left: 10px;
padding-right: 10px;
}

Resulta?  

[Nosferatu~]

Ainda não resultou.   

Ainda assim obrigado  

[Konai]

Autor, substitua o atual por este:

Código:

#fa_right .rightHeaderLink:nth-of-type(1) {
background-image: url(http://i.imgur.com/z1W2bJR.jpg)!important;
background-repeat: no-repeat!important;
border: 1px solid;
border-radius: 4px 4px 4px 4px;
color: rgba(0,0,0,0);
height: 73px!important;
letter-spacing: -999px;
margin-right: 10px;
margin-top: 29px;
padding-left: 10px;
padding-right: 10px;
width: 79px!important;
}
#fa_right .rightHeaderLink:nth-of-type(2) {
background-image: url(http://i.imgur.com/SfApqdK.jpg)!important;
background-repeat: no-repeat!important;
border: 1px solid;
border-radius: 4px 4px 4px 4px;
color: rgba(0,0,0,0);
height: 73px!important;
letter-spacing: -999px;
margin-right: 10px;
margin-top: 29px;
padding-left: 10px;
padding-right: 10px;
width: 117px!important;
}
#fa_right a.rightHeaderLink {
margin-left: -32px;
vertical-align: top;
line-height: 30px;
color: #FFFFFF;
}

Não se esqueça de salvar!

Veja o resultado:

Fico no aguardo!

[Nosferatu~]

Ola,Dokyo!
Ainda não funcional dessa vez sem alteração.

[Konai]

Ola,Dokyo!
Ainda não funcional dessa vez sem alteração.

O senhor poderia me fornecer a tua CSS para eu averiguar se há algum código em conflito e adicionar os códigos correctamente? Não digo que o senhor não saiba, mais se não está resultando, eu preciso conferir a tua CSS, pois eu edito os códigos em tempo real no navegador e os resultados são satisfatórios, e desejados.

Fico no aguardo!

[Nosferatu~]

Aqui esta
.

Código:

row2 {
  background:url('http://yourimg.in/m/1r4422i.png');
}
.row1 {background:url('http://yourimg.in/m/1r4422i.png');
}
.replies {
  border:none
}

#logostrip {
  background-color:#121212
}

    #submenu {
      padding: 0;
      text-align: center;
      }
    *+ html #submenu {
      padding: 0;
      }
    * html #submenu {
      padding: 0;
      }
    #submenu ul li a {
      padding: 0em 0em 0em 0;
      margin: 0em 0em 0em 0;
      text-decoration: none;
      }

a:link{
text-decoration:none;
}

.post-entry{
background:url('http://yourimg.in/m/hb6n853.png');
padding:10px;
color:#363636;
-moz-box-shadow: 5px 5px 7px #e5e5e5;
-webkit-box-shadow: 5px 5px 7px #e5e5e5;
box-shadow: 5px 5px 7px #e5e5e5;
text-shadow: 1px 1px 0px #FFFFFF;
-moz-box-shadow-top:inset 5px 0 10px #000000;
-webkit-box-shadow-top:inset 5px 0 10px #000000;
box-shadow-top:inset 5px 0 10px #000000;
}

.i_reply {
filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}

.i_reply:hover {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}

.post-icon {
filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}

.post-icon:hover {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}

.maintitle.floated {
  background-color: #191919
}

.post-footer.clearfix {
  background:url('http://yourimg.in/m/22eujr6.png');
}

.i_icon_quote {
  filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}
  
.i_icon_quote:hover {
  filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}

.i_icon_edit {
  filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}
  
.i_icon_edit:hover {
  filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}
  

.i_icon_delet {
  filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}
  
.i_icon_delet:hover {
  filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}


.button {
  display: inline-block;
  height:auto;
  padding: 5px 15px;
  font:normal 14px/1.1em arial;
  border:1px solid #828282;
  border-top-color:#828282;
  border-bottom-color:#9C9C9C;
  color:#9C9C9C;
  background:#fff;
  background: -moz-linear-gradient(top, #fff 60%, #e7e7e7);
  background: -webkit-linear-gradient(top, #fff 60%, #e7e7e7);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e7e7e7');
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -khtml-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: 0 2px 2px rgba(0,0,0,.2), 0 2px 0px rgba(0,0,0,.4), 0 1px 1px rgba(0,0,0,.2);
  -webkit-box-shadow: 0 2px 2px rgba(0,0,0,.2), 0 2px 0px rgba(0,0,0,.4), 0 1px 1px rgba(0,0,0,.2);
}

.button:hover {
  background:#e7e7e7;
  position:relative;
  top:2px;
  border-top-color:#909090;
  border-bottom-color:#ececec;
  -moz-box-shadow:inset px 2px 6px #928e8e;
-webkit-box-shadow:inset 0px 2px 6px #928e8e;
box-shadow:inset 0px 2px 6px #928e8e;
  
}

.button:active {
  background:#ffffff;
  position:relative;
  top:2px;
  border-top-color:#909090;
  border-bottom-color:#ececec;
  -moz-box-shadow:inset px 2px 6px #928e8e;
-webkit-box-shadow:inset 0px 2px 6px #928e8e;
box-shadow:inset 0px 2px 6px #928e8e;
  
}


.forumtitle {
   font-size:15px;
  font-family:Arial;
     }

input.button1, input.button2, button.button2, #main-content a.cgu-buttons, input.mainoption, input.liteoption {
    background: #f4f5f4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 2px;
    border: solid 1px #DDDDDD;
    }
    input.button1:hover, input.button2:hover, button.button2:hover, #main-content a.cgu-buttons:hover, input.mainoption:hover, input.liteoption:hover {
background-position: 0 100%;
border: 1px solid #86B125;
color: #89B125;
}

#logostrip {
min-height: 300px!important;
box-shadow: inset 0 -5px 0 rgba(0, 0, 0, 0.5)!important;
background: white url(http://i.imgur.com/MTX2SsK.jpg) center top!important;
margin: -5px -27px -52px -27px!important;
}
#submenu {
margin-bottom: 15px!important;
}
#userlinks,#navstrip {
display: none!important;
}

#gfooter a {
font-family: helvetica;
color: #EEE;
font-size: 12px;
text-shadow: 1px 1px 0 #5F5F5F;
font-weight: 700;
}
#gfooter {
box-shadow: inset 0px 2px 4px rgba(0, 0, 0, 0.2);
background-image: url('http://imageshack.com/a/img9/4286/q58j.png');
position: absolute;
width: 99%;
height: 100px;
z-index:-1;
}
DIV.centerer.footer-links {
position: absolute; 
bottom: 10px; 
right: 20px;
}
#gfooter select {
display: none; /*Hancki*/
}

#page-header .navbar ul.linklist li [href="/memberlist"]{display: none !important;}
.row2 {
  background:url('http://yourimg.in/m/1r4422i.png');
}
.row1 {background:url('http://yourimg.in/m/1r4422i.png');
}
.replies {
  border:none
}

#logostrip {
  background-color:#121212
}

    #submenu {
      padding: 0;
      text-align: center;
      }
    *+ html #submenu {
      padding: 0;
      }
    * html #submenu {
      padding: 0;
      }
    #submenu ul li a {
      padding: 0em 0em 0em 0;
      margin: 0em 0em 0em 0;
      text-decoration: none;
      }

a:link{
text-decoration:none;
}

.post-entry{
background:url('http://yourimg.in/m/hb6n853.png');
padding:10px;
color:#363636;
-moz-box-shadow: 5px 5px 7px #e5e5e5;
-webkit-box-shadow: 5px 5px 7px #e5e5e5;
box-shadow: 5px 5px 7px #e5e5e5;
text-shadow: 1px 1px 0px #FFFFFF;
-moz-box-shadow-top:inset 5px 0 10px #000000;
-webkit-box-shadow-top:inset 5px 0 10px #000000;
box-shadow-top:inset 5px 0 10px #000000;
}

.i_reply {
filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}

.i_reply:hover {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}

.post-icon {
filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}

.post-icon:hover {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}

.maintitle.floated {
  background-color: #191919
}

.post-footer.clearfix {
  background:url('http://yourimg.in/m/22eujr6.png');
}

.i_icon_quote {
  filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}
  
.i_icon_quote:hover {
  filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}

.i_icon_edit {
  filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}
  
.i_icon_edit:hover {
  filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}
  

.i_icon_delet {
  filter:alpha(opacity=95);
-moz-opacity: 0.95;
opacity: 0.95;
}
  
.i_icon_delet:hover {
  filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}


.button {
  display: inline-block;
  height:auto;
  padding: 5px 15px;
  font:normal 14px/1.1em arial;
  border:1px solid #828282;
  border-top-color:#828282;
  border-bottom-color:#9C9C9C;
  color:#9C9C9C;
  background:#fff;
  background: -moz-linear-gradient(top, #fff 60%, #e7e7e7);
  background: -webkit-linear-gradient(top, #fff 60%, #e7e7e7);
filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e7e7e7');
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -khtml-border-radius: 3px;
  border-radius: 3px;
  -moz-box-shadow: 0 2px 2px rgba(0,0,0,.2), 0 2px 0px rgba(0,0,0,.4), 0 1px 1px rgba(0,0,0,.2);
  -webkit-box-shadow: 0 2px 2px rgba(0,0,0,.2), 0 2px 0px rgba(0,0,0,.4), 0 1px 1px rgba(0,0,0,.2);
}

.button:hover {
  background:#e7e7e7;
  position:relative;
  top:2px;
  border-top-color:#909090;
  border-bottom-color:#ececec;
  -moz-box-shadow:inset px 2px 6px #928e8e;
-webkit-box-shadow:inset 0px 2px 6px #928e8e;
box-shadow:inset 0px 2px 6px #928e8e;
  
}

.button:active {
  background:#ffffff;
  position:relative;
  top:2px;
  border-top-color:#909090;
  border-bottom-color:#ececec;
  -moz-box-shadow:inset px 2px 6px #928e8e;
-webkit-box-shadow:inset 0px 2px 6px #928e8e;
box-shadow:inset 0px 2px 6px #928e8e;
  
}

input.button1, input.button2, button.button2, #main-content a.cgu-buttons, input.mainoption, input.liteoption {
    background: #f4f5f4 url(http://i66.servimg.com/u/f66/11/96/49/61/tabbg10.png);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    padding: 2px;
    border: solid 1px #DDDDDD;
    }
    input.button1:hover, input.button2:hover, button.button2:hover, #main-content a.cgu-buttons:hover, input.mainoption:hover, input.liteoption:hover {
background-position: 0 100%;
border: 1px solid #86B125;
color: #89B125;
}

#logostrip {
min-height: 300px!important;
box-shadow: inset 0 -5px 0 rgba(0, 0, 0, 0.5)!important;
background: white url(http://i.imgur.com/MTX2SsK.jpg) center top!important;
margin: -5px -27px -52px -27px!important;
}
#submenu {
margin-bottom: 15px!important;
}
#userlinks,#navstrip {
display: none!important;
}


#gfooter {
background-image: url(http://i.imgur.com/xYkw5YC.png);
box-shadow: 0 2px 4px rgba(0,0,0,0) inset;
height: 100px;
left: 0!important;
position: absolute;
right: 0!important;
width: auto!important;
z-index: -1;
margin: 0px 0;
}

.activeusers li {
margin-left: auto !important;
margin-right: auto !important;
width: 540px !important;
}

#picture_legend {
margin-left: 0px!important;
}

a.mainmenu img {
filter: alpha(opacity=40);
-moz-opacity: 0.4;
opacity: 0.4;
}

a.mainmenu img {
filter: alpha(opacity=40);
-moz-opacity: 0.4;
opacity: 0.4;
}

a:link {
text-decoration: none;
text-shadow: yes;
-webkit-transition: 180ms linear 0s;
-moz-transition: 180ms linear 0s;
-o-transition: 180ms linear 0s;
transition: 180ms linear 0s;
outline: 0 none;
}
a.mainmenu img:hover {
filter: alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0;
}

#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p:nth-of-type(1):after {
   color: #4A4A4A;
   content: "Total de Posts";
   letter-spacing: normal;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p:nth-of-type(2):after {
   color: #4A4A4A;
   content: "Total de Membros";
   letter-spacing: normal;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p:nth-of-type(2):not(strong) {
   margin-left: 10px;
   width: 130px;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p:nth-of-type(3):after {
   color: #4A4A4A;
   content: "Membro Mais Recente";
   letter-spacing: normal;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p:nth-of-type(3):not(strong) {
   margin-left: 10px;
   width: 210px;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p:nth-of-type(4):after {
   color: #4A4A4A;
   content: "    Recorde de Membros Online";
   letter-spacing: normal;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p:nth-of-type(4):not(strong)   {
   margin-left: 10px;
   width: 210px;   
}      
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p {
   color: rgba(0, 0, 0, 0) !important;
   float: left !important;
   margin-bottom: 2px;
   margin-right: 10px;
   margin-top: 2px;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p strong {
   background: none repeat scroll 0 0 #E2E2E2;
   border: 1px solid #C9CDD0 !important;
   border-radius: 2px 2px 2px 2px;
   color: #4A4A4A;
   display: inline-block;
   font-weight: 700;
   margin-right: 10px !important;
   padding: 2px 12px 2px 6px;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p span strong {
   border: medium none !important;
   letter-spacing: normal !important;
   margin: 0 !important;
   padding: 0 !important;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p:not(strong) {
   letter-spacing: -999px;
   margin-left: 10%;
   width: 110px;
}
#fo_stat .ipbtable tbody tr:nth-of-type(6) td.row2:last-child p a {
   color: #4A4A4A !important;
}

body {
margin-top: 0 !important;
}
#fa_toolbar {
margin-top: -30px !important;
}

#fa_right .rightHeaderLink:nth-of-type(1) {
background-image: url(http://i.imgur.com/z1W2bJR.jpg)!important;
background-repeat: no-repeat!important;
border: 1px solid;
border-radius: 4px 4px 4px 4px;
color: rgba(0,0,0,0);
height: 73px!important;
letter-spacing: -999px;
margin-right: 10px;
margin-top: 29px;
padding-left: 10px;
padding-right: 10px;
width: 79px!important;
}
#fa_right .rightHeaderLink:nth-of-type(2) {
background-image: url(http://i.imgur.com/SfApqdK.jpg)!important;
background-repeat: no-repeat!important;
border: 1px solid;
border-radius: 4px 4px 4px 4px;
color: rgba(0,0,0,0);
height: 73px!important;
letter-spacing: -999px;
margin-right: 10px;
margin-top: 29px;
padding-left: 10px;
padding-right: 10px;
width: 117px!important;
}
#fa_right a.rightHeaderLink {
margin-left: -32px;
vertical-align: top;
line-height: 30px;
color: #FFFFFF;
}

[JScript]

@Dokyo
Entenda o que o autor deseja:

Ola, Dokyo!
Gostaria que ficasse assim:

Portanto, não há erros no CSS do fórum dele que impediria de as imagens ficarem translúcidas!

---

@Nemo~
Consegui chegar neste nível:


Só falta deixar as palavras destacadas, sem o toque translúcido ok? Porém, seria bem mais fácil se você fizesse as imagens no formato PNG com o efeito translúcido!

Até mais,

JS

[Nosferatu~]

Ola, 
Peço desculpas pois não verifiquei o formato antes.

Aqui esta as imagens em .png:

[Nosferatu~]

Up!

[Boster Cheats]

@Nemo~

Eu Vi seu fórum e está com os botões do que queria.

Até.

[Nosferatu~]

Ja resolvi isso pode fechar . 
Obrigado.