Дефолтная высота контейнера для 'display: grid'?

Shimpanze,
Cпека https://www.w3.org/TR/css-display-3/
Осознавать проще читая MDN
https://developer.mozilla.org/ru/docs/Learn/CSS/Bu...
https://developer.mozilla.org/ru/docs/Learn/CSS/CS...

По умолчанию высота блочных элементов 0 и растягивается по содержимому.

Дефолтная высота контейнера для 'display: grid'?

Shimpanze, а по какой логике вы тут спрашиваете что говорит спецификация, а не читаете её? :) :) :)

Что не так с safari?

dudaevfrontend, как бы догадаться, что у вас в стилях...

Но начните с этого https://www.esolutions.se/en/test

Дефолтная высота контейнера для 'display: grid'?

А как, он занимает всю доступную высоту ПО ДЕФОЛТУ?

Никак.

Если его родитель не флекс и не грид. Но это уже не очень дефолт.

Самое простое - это создать песочницу с кодом (онлайн сервисы или файлики на вашем компе), задать цвет, обводку да и попробовать-посмотреть что будет.

Почему контент вылазит за высоту контейнера?

Overlord934, см комментарий выше.

У вас проблема не в верстке, а в геометрии с арифметикой. Сумму заданных вами размеров вообще невозможно вычислить.
gap в процентах приводит к проблемам и по горизонтали, а уж по вертикали почти всегда. За исключением фиксированной высоты.
Отступы в процентах считаются от ширины родителя. Даже вертикальные.
В итоге у вас там написана дичь.

Т.е. сначала нужно разобраться с тем, что вам нужно, в формулировках на родном языке. Потом с геометрией. И только потом писать свойства. И/или js к ним в помощь.

Можно начать читать вот отсюда https://learn.javascript.ru/height-percent

Почему контент вылазит за высоту контейнера?

Потому что не поместилось.

Научитесь делать песочницы на codepen.io с видимой проблемой и минимальным кодом, достаточным для её иллюстрации.

Перед тем как задавать что-то в процентах, имеет смысл выяснить от чего эти проценты считаются.

Как наложить несколько прозрачных png-изображений, чтобы они показывались по отдельности при наведении курсора?

SVG мне кажется поможет

Почему некорректно работает line-height в input?

ymfront, в FF вроде больше минимальный lh, но лень проверять. Потестируйте самостоятельно.

Почему некорректно работает line-height в input?

Минимальный line-height в текстовых полях 1.15 или типа того. И может отличаться в разных браузерах.
О каком браузере речь у вас, вообще неизвестно.

Как открыть блок под кнопкой на которую был клик?

Каждый контент поставьте после соответствующей кнопки.
Используйте гриды и dense.

Есть несколько визуально одинаковых блоков. Как сделать, чтобы у них все параметры в сss были одни, а фоновые изображения разные?

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

Как это сверстать?

sewaca, span ничем не отличается от div с точки зрения семантики. Сомнительная часть того совета.

Да, нужно использовать семантические теги. Но это не span.

Как это сверстать?

А, ну да, на скрине вижу, что всё таки флотами )))

Но рекомендую тогда не писать в ответе, что для решения вопроса (а проблема автора именно в этом моменте) достаточно флексов.

Как это сверстать?

в этом случае можно обойтись только флексами

Покажите, пожалуйста, как вы флексами или гридами поставите текст и дату?

Установка точки на изображении, не знаю как решить проблему?

Если съезжает при адаптиве, то считайте от центра.
Либо от того места к которому привязана трансформация, transform-origin, object-position и т.д.

Если съезжает по какой-то другой причине, то опишите её.
А ещё лучше сделать демо с примером на codepen.io (Только то, что относится к проблеме)

я координаты округлываю до 2 (15.69)

Правда, я плохо понимаю как 15.69 можно округлить до 2.

Как это сверстать?

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

Как сделать слайды по краям частично видемыми?

Михаил Р., это отменяет ценность ответа. Да и вопроса тоже.

Как сделать слайды по краям частично видемыми?

Михаил Р., потому что "легко гуглится"

Как сделать слайды по краям частично видемыми?

Пожалуйста, пример из документации https://swiper6.vercel.app/demos#centered
Если слайдер будет зациклен, то слева тоже будет слайд. А иначе какой вы собираетесь показывать перед первым?

Как исправить растягивания шрифта?

ReaperGermany, Фигма и браузер не будут одинаково рендерить шрифты. И разные браузеры тоже будут делать это по-разному.