HTML-таблица добавляет пространство внизу строки.

Question

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

ЗДЕСЬ ПРИМЕР

<table border="1">
      <tr>
        <td></td>

        <td>
          <form action="" method="post">
            <div>
              <input type="hidden" name="id" value="" />
              <input type="hidden" name="d" value="1" />
              <input type="image" src="../resources/img/direction/up_arrow.png" alt="Up" width="62" height="62" />
            </div>
          </form>
        </td>

        <td></td>
      </tr>

      <tr>
        <td>
          <form action="" method="post">
            <div>
              <input type="hidden" name="id" value="" />
              <input type="hidden" name="d" value="2" />
              <input type="image" src="../resources/img/direction/left_arrow.png" alt="Left" width="62" height="62" />
            </div>
          </form>
        </td>

        <td>
          <form action="" method="post">
            <div>
              <input type="hidden" name="id" value="" />
              <input type="hidden" name="r" value="1" />
              <input type="image" src="../resources/img/direction/rest_button.png" alt="Rest" width="62" height="62" />
            </div>
          </form>
        </td>

        <td>
          <form action="" method="post">
            <div>
              <input type="hidden" name="id" value="" />
              <input type="hidden" name="d" value="3" />
              <input type="image" src="../resources/img/direction/right_arrow.png" alt="Right" width="62" height="62" />
            </div>
          </form>
        </td>
      </tr>

      <tr>
        <td></td>

        <td>
          <form action="" method="post">
            <div>
              <input type="hidden" name="id" value="" />
              <input type="hidden" name="d" value="4" />
              <input type="image" src="../resources/img/direction/down_arrow.png" alt="Down" width="62" height="62" />
            </div>
          </form>
        </td>

        <td></td>
      </tr>
    </table>

Answer 1

form из td имеют запас. Добавить следующий CSS:

form {
    margin: 0;
}

Чтобы не допустить такого поведения, вы должны включить, например, normalize.css вместо.

Answer 2

Эта CSS решит вашу проблему:

form {margin:0;padding:0}

Дополнительное пространство в основном исходило от вашей формы. Вы, вероятно, удалили какой-то старый код из css, и поэтому он внезапно сломался.