Código html básico

Qual é minha questão:
Minha dúvida é bem simples e não envolve nada avançado.

Tenho no Rodapé do meu fórum três "box" onde reservo links para parceiros e outros.
Ambos estão apenas alinhados na Vertical, mas gostaria que houvesse dentro do mesmo espaço, uma segunda coluna sem divisória.

Ex:

Atual


Como gostaria de ficar

Código:

<p style="text-align: center;">
         <span style="color:#ffffff;"><strong>Sites recomendados</strong></span></p>
  <a href="http://www.gog.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
  <a href="http://store.steampowered.com/?l=portuguese"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
  <a href="http://www.gamefaqs.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a>
  <a href="http://www.howlongtobeat.com//"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> HowLongToBeat</a>


Endereço do meu fórum:
http://rpg-players.com

Versão do fórum:
PUNBB

Não entendi muito bem sua questão me explique um pouco mais...

Até mais

Gostaria que fosse implementado o código que passei para que houvesse na horizontal uma segunda coluna, no caso aqueles "links" que aparecem na imagem de como gostaria que ficasse.

Hoje não há ela, e está como na primeira imagem.

Tente

Código:

<p style="text-align: center;">
        <span style="color:#ffffff;"><strong>Sites recomendados</strong></span></p>
  <a href="http://www.gog.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
  <a href="http://store.steampowered.com/?l=portuguese"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
  <a href="http://www.gamefaqs.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a>
  <a href="http://www.howlongtobeat.com//"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> HowLongToBeat</a><div align="right"><a href="http://www.gog.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
  <a href="http://store.steampowered.com/?l=portuguese"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
  <a href="http://www.gamefaqs.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a></div>

coloquei repitido, se der algum erro avise

até

Tens como colocar uma distância (margin-left), ao invés do align="right"?

Ele acabou obstruído:

tente

Código:

<p style="text-align: center;">
        <span style="color:#ffffff;"><strong>Sites recomendados</strong></span></p>
  <a href="http://www.gog.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
  <a href="http://store.steampowered.com/?l=portuguese"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
  <a href="http://www.gamefaqs.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a>
  <a href="http://www.howlongtobeat.com//"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> HowLongToBeat</a><div align="left"><a href="http://www.gog.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
  <a href="http://store.steampowered.com/?l=portuguese"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
  <a href="http://www.gamefaqs.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a></div>

Até

Não resultou, Sheldon:

<p style="text-align: center;">
<span style="color:#ffffff;"><strong>Sites recomendados</strong></span></p>
<a href="http://www.gog.com/"><img src="https://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
<a href="http://store.steampowered.com/?l=portuguese"><img src="https://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
<a href="http://www.gamefaqs.com/"><img src="https://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a>
<a href="http://www.howlongtobeat.com//"><img src="https://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> HowLongToBeat</a><div align="center"><a href="http://www.gog.com/"><img src="https://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
<a href="http://store.steampowered.com/?l=portuguese"><img src="https://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
<a href="http://www.gamefaqs.com/"><img src="https://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a></div>

Não deu certo, Sheldon:

a imagem 2... você viu em algum fórum blog ou site?

Cara, não vi não.
Mas como é um html, achei que alguém teria um "table" ou algo similar para alinhar a segunda.

Por "&nbsp" um código ao lado do outro ele vai, mas não fica bem alinhado:

Fiz esse em um editor html online:

Código:

<html>
   <head>
      <title></title>
   </head>
   <body>
      <p style="text-align: center;">
         <span style="color:#ffffff;"><strong>Sites recomendados</strong></span></p>
      <p>
         <a href="http://www.gog.com/"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" /> GOG</a>                          <a href="http://www.gog.com/"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" /> GOG</a></p>
      <p>
         <a href="http://store.steampowered.com/?l=portuguese"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" /> STEAM</a>                      <a href="http://store.steampowered.com/?l=portuguese"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" /> STEAM</a></p>
      <p>
         <a href="http://www.gamefaqs.com/"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" /> GameFAQs</a>                <a href="http://www.gamefaqs.com/"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" /> GameFAQs</a></p>
      <p>
         <a href="http://www.howlongtobeat.com//"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" /> HowLongToBeat</a>        <a href="http://www.howlongtobeat.com//"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" /> HowLongToBeat</a></p>
   </body>
</html>


edit: Por algum motivo, o "&nbsp", não aparece quando postado dentro da tag code.

Qual editor voce usou


até mais

Esse, Sheldon.

http://versadus.com/flavius/editor/_samples/editor-html-online.html

tente

Código:

<p style="text-align: center;">
<span style="color:#ffffff;"><strong>Sites recomendados</strong></span></p>
<a href="http://www.gog.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
<a href="http://store.steampowered.com/?l=portuguese"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
<a href="http://www.gamefaqs.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a>
<a href="http://www.howlongtobeat.com//"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> HowLongToBeat</a><a href="http://www.gog.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG</a>
<a href="http://store.steampowered.com/?l=portuguese"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> STEAM</a>
<a href="http://www.gamefaqs.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GameFAQs</a></div>

Não resultou, Sheldon:

para teste use este código para testarmos

Código:

<p style="text-align: center;">
<span style="color:#ffffff;"><strong>Sites recomendados</strong></span></p>
<a href="http://www.gog.com/"><img src="http://i.imgur.com/jN3NEOk.png" border="0" alt="#" /> GOG                GGGOOOGGG</a>

Sheldon, eu consegui por "table", aqui:

Código:

<p style="text-align: center;">
<span style="color:#ffffff;"><strong>Sites recomendados</strong></span></p>
<html>
   <head>
      <title></title>
   </head>
   <body>
      <table align="left" border="0" cellpadding="1" cellspacing="1" style="width: 235px; height: 75px;">
         <tbody>
            <tr>
               <td>
                  <a href="http://www.gog.com/" style="margin: 0px; padding: 2px 0px 2px 5px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> GOG</span></a></td>
               <td>
                  <a href="http://www.gog.com/" style="margin: 0px; padding: 2px 0px 2px 5px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> GOG</span></a></td>
            </tr>
            <tr>
               <td>
                  <a href="http://www.gog.com/" style="margin: 0px; padding: 2px 0px 2px 5px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> GameFAQs</span></a></td>
               <td>
                  <a href="http://www.gog.com/" style="margin: 0px; padding: 2px 0px 2px 5px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> GameFAQs</span></a></td>
            </tr>
            <tr>
               <td>
                  <a href="http://www.gog.com/" style="margin: 0px; padding: 2px 0px 2px 5px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> Steam</span></a></td>
               <td>
                  <a href="http://www.gog.com/" style="margin: 0px; padding: 2px 0px 2px 5px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> Steam</span></a></td>
            </tr>
            <tr>
               <td>
                  <a href="http://www.gog.com/" style="margin: 0px; padding: 2px 0px 2px 5px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> HowLongBeat</span></a></td>
               <td>
                  <a href="http://www.gog.com/" style="margin: 0px; padding: 2px 0px 2px 5px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> HowLongBeat</span></a></td>
            </tr>
         </tbody>
      </table>

    </div>
  </td>

Mas meu overall_footer_end ficou com diversos erros em vermelho.



Tens como ver o que está errado no código acima e limpar o código?

é normal... tente salvar

Revisei o código eliminando as tags com erro.

Fica o código completo para que se um dia alguém tiver o mesmo problema:

Código:

<tr><td><a href="http://www.gog.com/" style="margin: 0px; padding: 2px 2px 2px 2px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> GOG</a></td>
               <td><a href="http://www.gog.com/" style="margin: 0px; padding: 2px 2px 2px 2px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> GOG</a></td></tr>
            <tr><td><a href="http://www.gog.com/" style="margin: 0px; padding: 2px 2px 2px 2px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> GameFAQs</a></td>
                <td><a href="http://www.gog.com/" style="margin: 0px; padding: 2px 2px 2px 2px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> GameFAQs</a></td></tr>
                                   <tr><td><a href="http://www.gog.com/" style="margin: 0px; padding: 2px 2px 2px 2px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> Steam</a></td>
                   <td><a href="http://www.gog.com/" style="margin: 0px; padding: 2px 2px 2px 2px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> Steam</a></td></tr>
            <tr><td><a href="http://www.gog.com/" style="margin: 0px; padding: 2px 2px 2px 2px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> HowLongBeat</a></td>
                <td><a href="http://www.gog.com/" style="margin: 0px; padding: 2px 2px 2px 2px; display: inline !important; text-decoration: none !important;"><img alt="#" border="0" src="http://i.imgur.com/jN3NEOk.png" style="margin: 0px; padding: 0px;" /> HowLongBeat</a></td></tr>
            </table></div></td>

Tópico resolvido.