Ячейки таблицы больше, чем они должны быть

Я создал систему карт для игры, которая работает по принципу рисования изображения карты из плиток. Для этого есть много причин, которые я не буду здесь вдаваться, но если вы действительно хотите знать, я уверен, что вы сможете узнать, как со мной связаться;)

У меня есть сделал последнюю версию живой, так что вы можете точно увидеть, где проблема и источник. Проблема в том, что линия между двумя верхними плитками и двумя нижними плитками, я не могу понять, почему это произошло так, и любая помощь будет принята с благодарностью.

В источнике есть маркер под названием «stackoverflow», если вы ищете «stackoverflow» при просмотре источника, он должен перенаправить вас к рассматриваемой таблице.

Я также загрузил изображение вопроса.

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer
В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...
Введение в CSS
Введение в CSS
CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.
Как выровнять Div по центру?
Как выровнять Div по центру?
Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...
Навигация по приложениям React: Исчерпывающее руководство по React Router
Навигация по приложениям React: Исчерпывающее руководство по React Router
React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...
Система управления парковками с использованием HTML, CSS и JavaScript
Система управления парковками с использованием HTML, CSS и JavaScript
Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Ангулярный шаблон для бронирования путешествий
Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...
14
0
8 798
4
Перейти к ответу Данный вопрос помечен как решенный

Ответы 4

Я знаю, что это может показаться плохим, но вам нужно убедиться, что между концом вашего тега <img> и началом конечного тега </td> нет пробелов.

то есть следующее будет представлять проблему:

<td>
 <img src = "image.jpg"/>
</td>

И этого не будет:

<td><img src = "image.jpg"/></td>

Надеюсь, это поможет.

Обновлено: ОК, это вообще не было решением. дох!

это может представлять ту же / аналогичную проблему

Mark W 17.08.2011 16:09

Я не искал всего этого, но проблема кроется где-то в таблицах стилей.

Если вы скопируете только ее табличную часть, карта будет отображаться правильно.

Если вы удалите последний тег </span> из этой части, он также будет работать (однако страница будет смешанной):

<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">

Так что либо попробуйте с самого начала с css, либо попытайтесь удалить их по одному, чтобы увидеть, что вызывает проблему.

Ответ принят как подходящий

Я думаю, вам нужно использовать display: block на своих изображениях. Для изображений inline есть немного дополнительного места для межстрочного интервала.

Вы также можете настроить высоту строки элемента td:

td {
    line-height: 0
}

Другие вопросы по теме