/ / O que há de errado com a minha mesa? - html

O que há de errado com a minha mesa? - html

Aqui está o código da tabela:

<table align="center" width="303" height="740" border="1" cellpadding="10">
<tr>
<th width="130" height="41" scope="col">URL1 - Normal</th>
<th width="121" scope="col">URL2  - Hover</th>
</tr>
<tr>
<td height="94"><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-green.png"/></td>
<td><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-green-h.png" alt=""/></td>
</tr>
<tr>
<td height="124"><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-blue.png" alt=""/></td>
<td><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-blue-h.png" alt=""/></td>
</tr>
<tr>
<td height="147"><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-grey-h.png" alt=""/></td>
<td><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-grey.png" alt=""/></td>
</tr>
<tr>
<td height="137"><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-pink.png" alt=""/></td>
<td><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-pink-h.png" alt=""/></td>
</tr>
<tr>
<td height="132"><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-red.png" alt=""/></td>
<td><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-red-h.png" alt=""/></td>
</tr>
<tr>
<td height="132"><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-black.png" alt=""/></td>
<td><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-black-h.png" alt=""/></td>
</tr>
</table>

Quando insiro a tabela, deixa uma lacuna entre a tabela e o texto. Se eu remover a mesa, tudo está bem. O que está errado aqui?

Respostas:

5 para resposta № 1

Blogspot insere quebras de linha para você... e eles empurram a mesa para baixo. (Eu ainda não encontrei uma solução).

Se você visualizar a fonte, poderá vê-las:

<table align="center" width="303" height="740" border="1" cellpadding="10"><br />
<tr><br />
<th width="130" height="41" scope="col">URL1 - Normal</th><br />
<th width="121" scope="col">URL2  - Hover</th><br />
</tr><br />
<tr><br />
<td height="94"><img src="/images/http://i1018.photobucket.com/albums/af309/5416339/ad-green.png"/></td><br />
...

Porque o BRs são inválidos quando diretamente dentro de um TABLE, TRou depois de um TH ou TD, o navegador empurra esses elementos para fora e acima da tabela ao renderizar o DOM.


1 para resposta № 2

Se você der uma olhada na fonte da página, você notará uma tonelada de <br/> tags intercaladas com sua tabela (mas não contidas nos elementos da célula). Eles são renderizados acima da tabela.

Parece que seu HTML está sendo analisado por algo e suas quebras de linha estão sendo substituídas por tags BR.

Solução rápida: remova todas as quebras de linha e apenas tenha o código da tabela em uma linha :)


1 para resposta № 3

Não tem nada a ver com a mesa. É o fato de que existem 31 <br> (quebra de linha) tags antes da tabela (que são o que estão criando a lacuna enorme.

Parece que o BlogSpot (ou qualquer serviço de blog que você esteja usando) está adicionando <br> tags baseadas em como você está formatando o restanteseu conteúdo. Edite a origem da página, se possível, e remova-a manualmente ... caso contrário, ela se tornará um problema de suporte em qualquer plataforma de blog em que você esteja.


0 para a resposta № 4

Isso não tem nada a ver com nada em seu table marcação. A visualização do código HTML dessa página mostra cerca de 30 <br> tags à frente da tabela. Eles são obviamente responsáveis ​​pelo espaço extra.

Por que você tem 30 <br> tags ao inserir uma tabela deve ter algo a ver com a forma como blogspot.com está formatando seu conteúdo. Sua melhor aposta é tentar editar o HTML manualmente para remover o <br> Tag. Se você não pode fazer isso, ou se o <br> tags não aparecem ao editar o HTML, é uma questão para o atendimento ao cliente no Blogspot.