Как удалить внутренние границы серии изображений и сохранить непрерывную внешнюю границу в css?

Question

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

Так что-то вроде этого, со многими изображениями посередине.

 _____
|_____| 

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

Как удалить пробелы, но при этом сохранить единую непрерывную границу вокруг формы изображений.

Редактировать: я пытаюсь создать игру, в которой, если человек выбирает картинку, она подсвечивает все те, что вокруг нее. Что-то вроде украшенного драгоценными камнями, где, если вы выделяете цвет, плитки того же цвета выделяются сами собой. Изображения все одинакового размера, выложены в виде сетки.

Answer 1

Удалите все границы с изображений и оберните их в <div />:

<div class="image-wrapper">
  <img />
  <img />
  ...
  <img />
</div>

Затем просто примените к нему CSS:

.image-wrapper {
  border: 8px solid rgb(220, 220, 255);
}