html: Как сделать так, чтобы отступ между колонками не менялся?

Есть вот такой код.
1) Как сделать, чтобы элемент №3 не ломался на 2 части? [Решение уже получено в ответе.]
2) Как убрать расстояние между колонками? То есть чтобы вторая колонка примыкала к элементу №2.
3) Как сделать так, чтобы количество колонок такого формата (у них нужное выравнивание - по левой стороне) высчитывалось браузером автоматически исходя из ширины экрана?

Без использования max-height, потому что количество элементов и их размер будут меняться. Из-за этого использование двух контейнеров для колонок тоже не подходит.

body {
  display: inline-block;
  border: 1px solid red;
  column-count: 2
}

.item {
  border: 1px solid #000
}

1
2
3
4
5