Células da tabela maiores do que deveriam ser
Pergunta
Eu criei um sistema de mapas para um jogo que funciona com base no princípio de desenhar a imagem do mapa a partir de peças.Há muitas razões para isso que não vou abordar aqui, mas se você realmente quiser saber, tenho certeza de que pode descobrir como entrar em contato comigo;)
Eu tenho disponibilizou a versão mais recente para que você possa ver exatamente onde está o problema e a origem.O problema é a linha entre os 2 blocos superiores e os 2 blocos inferiores. Não consigo entender por que ficou assim e qualquer ajuda seria apreciada.
Na fonte há um marcador chamado "stackoverflow", se você pesquisar por "stackoverflow" ao visualizar a fonte, ele deverá levá-lo à tabela em questão.
Eu também carreguei um imagem do problema.
Solução
Eu acho que você precisa usar display: block
em suas imagens.Quando as imagens são inline
há um pouco de espaço extra para o espaçamento entre linhas.
Outras dicas
Você também pode ajustar a altura da linha do elemento td:
td {
line-height: 0
}
Eu sei que isso pode parecer ruim, mas você precisa garantir que não haja espaços em branco entre vocês <img>
tag e o início do fim </td>
marcação.
ou sejaO seguinte apresentará o problema:
<td>
<img src="image.jpg"/>
</td>
E isso não irá:
<td><img src="image.jpg"/></td>
Espero que ajude.
Editar:OK, essa não foi a solução.ah!
Não pesquisei tudo, mas o problema está em algum lugar nas folhas de estilo.
Se você copiar apenas a parte da tabela, o mapa estará sendo exibido corretamente.
Se você remover o final </span>
tag desta parte, também está funcionando (no entanto, a página fica misturada):
<div class="inner"><span class="corners-top"><span></span></span>
<div class="content" style="font-size: 1.1em;">
<!-- Stackoverflow findy thingy -->
<table border="0" cellspacing="0" cellpadding="0">
Então tente desde o início com o css ou tente removê-los um por um, para ver o que está causando o problema.