1. Este site usa cookies. Ao continuar a usar este site está a concordar com o nosso uso de cookies. Saber Mais.

Trabalhar com tabelas

Discussão em 'Web Development' iniciada por Kandalf, 2 de Setembro de 2007. (Respostas: 11; Visualizações: 1338)

  1. Kandalf

    Kandalf Power Member

    Pessoal tenho uma dúvida muito básica mas não sei como resolver. Arranjei um template e aquilo é tipo uma tabela centrada com 766 de largura e tem lá dentro o conteúdo o que eu quero é colocar do lado de fora da tabela publicidade mais concretamente um banner vertical mas quero que ele fique encostado a tabela do lado direito.

    Eu consigo colocar o banner de lado o problema é encosta-lo à tabela não consigo fazer isso.

    Se não perceberem o que eu quero eu faço um desenho e meto aqui
     
  2. OldMan

    OldMan Power Member

    Desenho please :D
     
  3. Kandalf

    Kandalf Power Member

    Aqui vai o desenho do que eu quero eu já quase que consegui fazer aquilo mas falta qualquer coisa.

    [​IMG]

    Tipo eu já tenho o fundo e a tabela central com o "site" e quero agora acrescentar ao lado banner como faço isso.

    Será que tenho que criar outra tabela? Eu já tentei isso mas não consigo que elas fiquem juntas so consigo colocar uma nova tabela ou tudo a esquerda ou tudo a direita
     
  4. OldMan

    OldMan Power Member

    Deves ter algo deste género:

    Código:
    <table>
      <tr>
        <td>
    *coisas aqui po meio*
        </td>
      </tr>
    </table>
    
    agora depende se tens uma célula a envolver o site todo (1), e depois dentro dessa célula tens outra tabela, ou se tens essa tabela de fora dividida (2) (só com o código é que consigo ver).

    solução para (1):

    Código:
    <table>
      <tr>
        <td>
    *coisas aqui po meio*
        </td>
        <td>
    *banner*
        </td>
      </tr>
    </table>
    
    solução para (2):

    Código:
    <table>
       <tr>
         <td>
     *coisas aqui po meio*
         </td>
        <td rowspan="?">
    *banner*
        </td>
       </tr>
     </table>
    
    aquele "?" depende de quantas divisões verticais tem essa tabela.
     
    Última edição: 2 de Setembro de 2007
  5. Kandalf

    Kandalf Power Member

    Eu estou a utilizar o exemplo 2 acho que era o que se adequava ao que eu tinha.

    Mas estou agora com um problema já consegui colocar mais uma coluna na tabela ou seja tinha uma tabela de 766 e aumentei para 866 e fiquei assim com uma coluna livre ao lado sem estragar o que já tinha mas quando coloco lá um banner ele fica a meio da coluna não fica junto a cima como eu queria.

    Fica aqui o código é só executar que aparece logo a tabela com o banner eu queria-o chegar para cima.

    Código:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Untitled Document</title>
    </head>
    
    <body>
    <TABLE WIDTH=866 BORDER=1 CELLPADDING=0 CELLSPACING=0 align="center" height="100%">
        <TR>
            <TD COLSPAN=2 HEIGHT=114>&nbsp;</TD>
            <TD COLSPAN=4 HEIGHT=114>&nbsp;</TD>
            <TD COLSPAN=4 HEIGHT=114>&nbsp;</TD>
             <TD COLSPAN=5 HEIGHT=114>&nbsp;</TD>
              <TD COLSPAN=7 HEIGHT=114>&nbsp;</TD>
           
           <TD rowspan=5 ><a href="http://www.linkws.com" target="_blank"><img src="http://www.linkws.com/br/images/bannerv_120_240.gif" width="120" height="240" border="0" align="texttop" /></a></TD>
      </TR>
        
        <TR>
            <TD COLSPAN=22 HEIGHT=16>&nbsp;</TD>
        </TR>
        
        <TR>
            <TD COLSPAN=22 HEIGHT=118>&nbsp;</TD>
        </TR>
        
        <TR>
            <TD COLSPAN=4 HEIGHT=37 >&nbsp;</TD>
             <TD COLSPAN=3 HEIGHT=37>&nbsp;</TD>
            <TD COLSPAN=7 HEIGHT=37>&nbsp;</TD>
            <TD COLSPAN=5 HEIGHT=37>&nbsp;</TD>
            <TD COLSPAN=3 HEIGHT=37>&nbsp;</TD>
        </TR>
        
        
        <TR>
          <TD COLSPAN=20 valign="top" height="100%" background="imagem">
            <!--right text-->
                <TABLE WIDTH=584 BORDER=0 CELLPADDING=0 CELLSPACING=0>
                    <TR>
                        <TD ROWSPAN=4 background="" WIDTH=175 HEIGHT=394 ALT="" valign="top" style="background-repeat:no-repeat; background-position:top">
            
                        </TD>
                        <TD COLSPAN=3>&nbsp;</TD>
                    </TR>
                    <TR>
                        <TD>&nbsp;</TD>
                        <TD>&nbsp;</TD>
                        <TD>&nbsp;</TD>
                    </TR>
                    <TR>
                        <TD>&nbsp;</TD>
                        <TD>&nbsp;</TD>
                        <TD>&nbsp;</TD>
                    </TR>
                    <TR>
                        <TD COLSPAN=3><p>&nbsp;</p></TD>
                    </TR>
                </TABLE>      
          </TD>
          <TD COLSPAN=2  valign="top" height="100%" background="imagem">
            <!--left text--><br>
    
          <!--left text-->      
          </TD>
        </TR>
        
        
        <TR>
            <TD COLSPAN=4 WIDTH=160 HEIGHT=37 >&nbsp;</TD>
            <TD COLSPAN=3 WIDTH=119 HEIGHT=37>&nbsp;</TD>
            <TD COLSPAN=7 WIDTH=105 HEIGHT=37>&nbsp;</TD>
            <TD COLSPAN=5 WIDTH=191 HEIGHT=37>&nbsp;</TD>
            <TD COLSPAN=3 WIDTH=191 HEIGHT=37>&nbsp;</TD>
        </TR>
        
        <TR>
            <TD COLSPAN=22 background="imagem" HEIGHT=29 ALT="">
            </TD>
        </TR>
        
        
        <TR>
            <TD width="98">
                <IMG SRC="images/spacer.gif" WIDTH=98 HEIGHT=1 ALT=""></TD>
            <TD width="8">
                <IMG SRC="images/spacer.gif" WIDTH=8 HEIGHT=1 ALT=""></TD>
            <TD width="15">
                <IMG SRC="images/spacer.gif" WIDTH=15 HEIGHT=1 ALT=""></TD>
            <TD width="39">
                <IMG SRC="images/spacer.gif" WIDTH=39 HEIGHT=1 ALT=""></TD>
            <TD width="31">
                <IMG SRC="images/spacer.gif" WIDTH=31 HEIGHT=1 ALT=""></TD>
            <TD width="21">
                <IMG SRC="images/spacer.gif" WIDTH=21 HEIGHT=1 ALT=""></TD>
            <TD width="67">
                <IMG SRC="images/spacer.gif" WIDTH=67 HEIGHT=1 ALT=""></TD>
            <TD width="15">
                <IMG SRC="images/spacer.gif" WIDTH=15 HEIGHT=1 ALT=""></TD>
            <TD width="36">
                <IMG SRC="images/spacer.gif" WIDTH=12 HEIGHT=1 ALT=""></TD>
            <TD width="36">
                <IMG SRC="images/spacer.gif" WIDTH=12 HEIGHT=1 ALT=""></TD>
            <TD width="26">
                <IMG SRC="images/spacer.gif" WIDTH=9 HEIGHT=1 ALT=""></TD>
            <TD width="12">
                <IMG SRC="images/spacer.gif" WIDTH=11 HEIGHT=1 ALT=""></TD>
            <TD width="42">
                <IMG SRC="images/spacer.gif" WIDTH=38 HEIGHT=1 ALT=""></TD>
            <TD width="8">
                <IMG SRC="images/spacer.gif" WIDTH=8 HEIGHT=1 ALT=""></TD>
            <TD width="44">
                <IMG SRC="images/spacer.gif" WIDTH=43 HEIGHT=1 ALT=""></TD>
            <TD width="17">
                <IMG SRC="images/spacer.gif" WIDTH=17 HEIGHT=1 ALT=""></TD>
            <TD width="9">
                <IMG SRC="images/spacer.gif" WIDTH=9 HEIGHT=1 ALT=""></TD>
            <TD>
                <IMG SRC="images/spacer.gif" WIDTH=61 HEIGHT=1 ALT=""></TD>
            <TD width="61">
                <IMG SRC="images/spacer.gif" WIDTH=61 HEIGHT=1 ALT=""></TD>
            <TD width="10">
                <IMG SRC="images/spacer.gif" WIDTH=10 HEIGHT=1 ALT=""></TD>
            <TD width="44">
                <IMG SRC="images/spacer.gif" WIDTH=44 HEIGHT=1 ALT=""></TD>
            <TD>
                <IMG SRC="images/spacer.gif" WIDTH=137 HEIGHT=1 ALT=""></TD>
            <TD>
                <img src="images/spacer.gif" width=100 height=1 alt=""></TD>
      </TR>
      
    </TABLE>
    </body>
    </html>
    
    Se alguém me souber dizer como resolver isto agradeço muito

    PS: O "spacer.gif" é 1 pixel branco
     
  6. majo-san

    majo-san Power Member

    Tens isto:
    Código:
    <TD rowspan=5 ><a href="http://www.linkws.com" target="_blank"><img src="http://www.linkws.com/br/images/bannerv_120_240.gif" width="120" height="240" border="0" align="texttop" /></a></TD>
    Muda para isto:
    Código:
    <TD rowspan=5 [B]valign="top"[/B]><a href="http://www.linkws.com" target="_blank"><img src="http://www.linkws.com/br/images/bannerv_120_240.gif" width="120" height="240" border="0" [I]align="texttop" [/I]/></a></TD>
    O código a bold (valign="top") é o que precisas de acrescentar. O código a itálico (align="texttop") acho que podes retirar porque não serve para nada. Não testei mas deve funcionar.
     
  7. Kandalf

    Kandalf Power Member


    Obrigadão era mesmo isso o meu problema é não saber estes comandos básicos e perco muito tempo a descobrir mas deste-me uma grande ajuda..
     
  8. OldMan

    OldMan Power Member

    Que me lembre não há nenhuma propriedade de "texttop" para o atributo "align".
    Não cheguei a experimentar o código, parece que já resolveste.
     
  9. Tuaregue

    Tuaregue Power Member

    já não se usam tabelas para formatar sites. são as normas. utilizam-se as Div
     
  10. HecKel

    HecKel The WORM

    Tuaregue, neste caso o Kandalf arranjou um template..., não o iria alterar todo só para ficar dentro das normas. Certamente que perderia bastante tempo e só se tivesse bastante experiência é que conseguiria o mesmo efeito.

    Ele apenas quer saber como adaptar o template às necessidades dele, mas sim, de facto é uma boa recomendação, aprender a fazer bem para fazer bons trabalhos.

    HecKel
     
  11. majo-san

    majo-san Power Member

    Eu já não trabalho com tabelas há anos o.O mas foram outros tantos anos a trabalhar com elas, por isso ainda está retido na memória.
    Outra coisa: para o caso de quereres saber, o XHTML não aceita maiúsculas nas tags. Ou pões tudo em minúsculas ou mudas o doctype para HTML. Enfim, os browsers em princípio ignoram os erros e mostram direito, mas é erro.
     
  12. Kandalf

    Kandalf Power Member

    Ok isto já vinha em maiúsculas e não tive a mudar até porque não sabia que fazia mal. Também sei que agora usa-se as Div e recentemente andei a fazer outro site e usei div mas este template trazia tabelas e foi uma confusão para entender isto.

    Como a minha experiência é muito pouca tenho utilizado templates para me inspirar e depois acabo por modificar quase totalmente mas acho que ainda não estou pronto para fazer um site de raiz consigo desenrascar-me e quando tá mais difícil pergunto o meu maior problema é a parte gráfica porque programação até mando uns toques.

    Mas obrigado pelas opiniões e ajudas
     

Partilhar esta Página