Какие свойства можно прописать, чтоб галерея уменьшалась подобным образом?

Overlord934, что-то вы совсем детский садик разводите
Ну давайте поговорим
1. Я вообще ничего не говорила про высоту.
2. В демке в вопросе высота не меняется.
3. В демке как бы из моего ответа меняется (несмотря на п1)

Нужна фиксированная высота - задавайте фиксированную.

4. Со строками тоже нужно работать. У вас же каждая картинка занимает одну строку.
5. Ещё я там говорила про object-fit. Рекомендую всё таки почитать.

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

Какие свойства можно прописать, чтоб галерея уменьшалась подобным образом?

Это дубль вашего же вопроса Как сделать чтоб изображения в grid сетке уменьшал...
Более того, в комментариях к нему я уже написала, что делать.

А вы снова зовете меня в такой же.
Этот вопрос можно удалить как "это задание, а не вопрос", потому что совершенно не понятно, что не получилось по рекомендациям из предыдущего.

Можно ли последовательно расположить три элемента в грид ячейке, чтобы они не перекрывали друг друга?

Overlord934, нужно нарисовать вертикальные линии по всем "швам" и посчитать количество получившихся столбцов.

Альтернатива это плагины типа isotope.

Можно ли последовательно расположить три элемента в грид ячейке, чтобы они не перекрывали друг друга?

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

Отвечая на ваш вопрос: нет, нельзя.
Можно каждое из них прибить к своему краю, но они будут накладываться, если не влезут. Либо задавать им ширину в %.

Какой это шрифт?

Проще и быстрее всего использовать сервис-определитель

Откуда берется лишняя колонка на grid?

Откуда берется лишняя колонка на grid?

Кто-то же написал это

.gallery__item-5{
    grid-column-start: 4;
}

и аналогичные правила.

И, может, всё таки nth-child?
Правда, пока, по этому примеру, не видно зачем вы вообще пишете линии в явном виде.

От чего зависит куда будет зумиться сайт при ctrl + колёсико мыши? Так же как отключить зум на колесо мыши + ctrl?

ViktorSorokin, зато в вашем вопросе сайт.

От чего зависит куда будет зумиться сайт при ctrl + колёсико мыши? Так же как отключить зум на колесо мыши + ctrl?

знаю что так не стоит делать но всё же

Вот и не делайте, пожалуйста.

Лучше кривой сайт, чем информация, которую вообще не разглядеть, потому что вы запретили масштабирование, считая, что и так видно.

Как ускорить итерацию в два раза?

Vasya-prijevalskij, я не знаю, что вы пишете

так

Но задача выглядит странно (даже дико) и лучше бы рассказать её в изначальном виде.

Как ускорить итерацию в два раза?

Vasya-prijevalskij, две строчки и ++ и console.log

Как ускорить итерацию в два раза?

Топорный вариант в голову не приходил?
Просто повторить строчки второй раз?
Чуть хитрее и если больше повторений - циклом.

Как сделать ромбообразную сетку?

faer23, присоединяюсь к вопросу Максима.
SVG как раз таки весь из себя резиновый.

Подложка = фон, псевдо нижним слоем грида... Как хотите.

Как сделать чтоб изображения в grid сетке уменьшались в размерах при сужении?

Overlord934, в практике аналогично.
Ещё до кучи есть object-fit, чтобы было совсем хорошо и надежно.

Как сделать адаптивную grid сетку?

Solevoy_2015, https://developer.mozilla.org/ru/docs/Web/CSS/flex-grow

Как сделать чтоб изображения в grid сетке уменьшались в размерах при сужении?

Overlord934,

Нужно чтоб картинки уменьшались при сужении ширины экрана.

Ну и что нужно написать, чтобы картинка была по размеру родителя?

Как сделать ромбообразную сетку?

1. Подложку градиентами.
Элементы гридом.

2. Элементы гридом, бордеры, rotate.
Внутренности поворачиваем в обратную сторону.

3. Фон svg
Элементы гридом

4. Всё SVG

Можно ли сократить повторяющийся css без доп класса?

[class^=border] {}
Тонкости использования селекторов атрибутов в CSS

Также есть селектор *,но лучше не надо для вложенных.

По разуму, класс бы выиграл.

Почему не подключается файл JS к файлу html?

NickUser, давайте начнем с простого.
Удалите из js файла, что там написано.
Напишите console.log("Вообще-то я явно подключился")

Потом приходите с новым вопросом и кодом в песочнице codepen.io
Пока её делаете, почините следующую проблему.

Как разместить строчные элементы в разные края блока?

Solevoy_2015, я же не спрашивала как это сделать флоатами.

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

Как спозиционировать так карточки?

Не видно зачем тут нужен абсолют.

Если можно на гридах или флексах

Можно.
Просто грид 2х2 и отступы. Или выравнивание внутри ячеек грида.
Или не 2х2, а 7х7.

Или аналогично флексами.

Что именно у вас не получилось?