Botão de reputação na forma de imagens (phpbb 2 e punbb)

Fiz igual no tutorial: https://ajuda.forumeiros.com/tutoriais-astucias-f5/tutorial-botao-de-reputacao-na-forma-de-imagens-phpbb-2-e-punbb-t26315.htm


Mas as Imagens ficam de fora da tabela...



Tem Como arrumar?

Olá!

Já tentou diminuir o tamanho da imagem?
Ou mesmo adicionar o CSS que é requerido no tutorial?

Até mais,
Hancki

a coloquei o css,mas não arruma isso,

ai coloquei eles do lado esquerdo,

mas tem como colocar uma imagem do lado da outra?

Porque fique essa barrinha ---- Dividindo os dois botões,eu queria assim:



Como faço o código? é esse atual:

Código:

<!-- BEGIN switch_vote_active -->
                  <div class="vote gensmall">
                     <!-- BEGIN switch_vote -->
                     <left><div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_PLUS}"><img src="http://img7.imageshack.us/img7/6774/gostei.gif"></a></div></left>
                     <!-- END switch_vote -->

                     <!-- BEGIN switch_bar -->
                     <div class="vote-bar" title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}">
                        <!-- BEGIN switch_vote_plus -->
                        <div class="vote-bar-plus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_plus.HEIGHT_PLUS}px;"></div>
                        <!-- END switch_vote_plus -->

                        <!-- BEGIN switch_vote_minus -->
                        <div class="vote-bar-minus" style="height:{postrow.displayed.switch_vote_active.switch_bar.switch_vote_minus.HEIGHT_MINUS}px;"></div>
                        <!-- END switch_vote_minus -->
                     </div>
                     <!-- END switch_bar -->

                     <!-- BEGIN switch_no_bar -->
                     <div title="{postrow.displayed.switch_vote_active.L_VOTE_TITLE}" class="vote-no-bar">----</div>
                     <!-- END switch_no_bar -->

                     <!-- BEGIN switch_vote -->
                     <div class="vote-button"><a href="{postrow.displayed.switch_vote_active.switch_vote.U_VOTE_MINUS}"><img src="http://img522.imageshack.us/img522/6397/ngostei.gif"></a></div>
                     <!-- END switch_vote -->
                  </div>
                  <!-- END switch_vote_active -->

Bom dia,

No tutorial que você referiu existe isso: Adicionar um código CSS para evitar possíveis problemas de posicionamento! Leia com atenção o ponto 3 que é o responsável por resolver este problema visual!

O código deve ficar mais ou menos assim:

Código:

.vote {
float: right;
width: 88px;
margin-left: 4px;
}

Até mais.

Funcionou Solkis, Obrigado