Чем правильно задавать верхний отступ на странице сайта padding или margin?

Кто же знает что нарисовано у вас в макете?

Может быть это вообще не отступ, а градиент?
Или отступ, но не у body?

В большинстве современных сайтов там скорее будет padding для header. Но опять же, макет-то где?

Иконочные шрифты для сайтов, необходимо ли использовать в 2024г?

szQocks, суть особо не изменилась по сравнению со спрайтом на symbol.
Можно продолжать называть спрайтом. Главное, что не на symbol и что работает везде.

Иконочные шрифты для сайтов, необходимо ли использовать в 2024г?

szQocks, как старые спрайты из symbol (работали только в use), только теперь svg состоящая из svg.
Stack — спрайт здорового человека

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

MrFox235, скрипт работает так, как вы скажете. Например, закроет меню по esc. CSS об этом ничего не знает.

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

Можно поменять на focus-within
Но лучше бы на JS.

Как правильно реализовать анимацию?

historydev, если устраивает результат, то ок.

Что можно улучшить:
- Я бы заменила абсолют на грид. Тогда псевдо не провалится под фон страницы со своим отрицательным z-index.
- Кнопка с фикс размерами уязвима к переполнению и обычно так не делают.
- all у transition - зачем заставлять браузер думать обо всех свойствах, когда по факту меняются два.

Как правильно реализовать анимацию?

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

Это хорошо, что не нравится. Спека тоже запрещает это делать.

Замените на псевдоэлементы.

Почему размеры в фигме и размеры на сайте - отличаются на деле?

crack_user, нет, это косяк верстальщика.

Дизайнер нарисовал какую-то конкретную ширину (он же не может нарисовать все). На этой ширине вьюпорта всё должно выглядеть как в макете.
А дальше перестраиваете, чтобы на любой ширине хорошо выглядело.
Если самому никак, консультируйтесь с дизайнером.

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

Логичнее открытому добавлять один раз класс is-open

Почему размеры в фигме и размеры на сайте - отличаются на деле?

Очевидно, у вас размер вьюпорта меньше 1640px.
Можно проверить тут: https://www.esolutions.se/en/test

Скорее всего, в системе в настройке масштабирования стоит не 100% (особенно это вероятно, если речь о ноутбуке).

Как в grid сделать, чтобы не зависеть от template-columns?

Тут же явно 3 колонки, а не две.
И grid-row: span 2 для элементов (а не ширина), которые занимают по две колонки. Через nth-child.

Почему не работает padding-top padding-bottom у placeholder?

Потому что паддинги должны быть у инпута. Всё заработает.

Как спрятать кнопку если больше нечего подгружать?

valgerofficial,
1. Узнать сколько всего элементов. Сложить в переменную.
2. При каждом клике вычитать 4
3. Проверять что вышло. Если меньше нуля, добавить кнопке класс, который её скроет. Либо атрибут hidden.

Как спрятать кнопку если больше нечего подгружать?

Хоть в лоб: путем простого вычитания и сравнения

Оплата доменов в зоне .com через skrill.com без ограничений для РФ?

Михаил, вы меня вчера позвали сюда Горизонтальное, адаптивное, раскрывающее меню с блоками в подменю, почему внутри блоков не центрует название и иконку?
Что вам рассказать по тому поводу?

Хотел чтобы фото были на всю ширину без пробелов. Что за отступы от фотографий?

Во-первых, не поможет.
Во-вторых, там и img-то нет.

Хотел чтобы фото были на всю ширину без пробелов. Что за отступы от фотографий?

Сейчас никто не использует float для сеток.
Сделайте .slider__div флексом.

Ещё нужно знать, что после инлайновых элементов браузер ставит "пробел" (вправо или вниз). Флексы решают и эту проблему.

Ну и сейчас, без примера проблемы на codepen.io, мы играем в угадайку

Почему код на странице правильно отображается во всех браузерах, кроме приложения Google Chrome на Realme 11 Pro +?

BLM21, чисто посмеяться, а если заинлайнить

spoiler

background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 926 926'%3E%3Cpath d='M428.5 922.495c-141.687-10.43-271.104-86.38-349.959-205.38C42.395 662.568 18.184 601.301 8.156 539c-5.356-33.267-5.61-36.721-5.6-76 .009-39.18.388-44.405 5.597-77 12.653-79.174 48.626-156.766 102.69-221.5 9.58-11.472 42.904-44.779 54.657-54.63C244.316 43.804 341.006 5.905 440.472 2.09c68.865-2.643 125.252 6.14 186.343 29.026 27.322 10.236 63.094 28.009 71.034 35.293 12.699 11.65 12.37 31.016-.726 42.79-10.56 9.494-20.915 10.209-35.623 2.46-53.222-28.041-92.03-40.802-148.5-48.83-22.452-3.192-76.893-3.226-100-.062-94.41 12.925-173.221 52.367-238.5 119.36C100.105 258.475 60.65 355.992 60.86 463c.185 93.864 29.92 178.485 88.55 252 23.809 29.852 62.854 65.04 95.09 85.692 53.721 34.417 106.924 53.47 173 61.95 21.843 2.805 73.201 2.537 95.477-.496 69.127-9.414 129.713-32.985 183.205-71.276 113.2-81.033 176.63-212.154 168.936-349.22-.653-11.632-1.616-24.075-2.139-27.65-4.3-29.378-7.832-46.167-14.092-67-2.23-7.425-4.298-15.784-4.593-18.575-1.607-15.171 10.497-29.78 25.825-31.17 10.65-.965 20.79 3.497 26.8 11.792 5.988 8.267 16.818 48.798 22.165 82.953 6.523 41.67 6.665 96.858.358 139-10.41 69.553-37.338 137.307-77.253 194.374-39.298 56.184-90.967 103.671-149.222 137.145-80.161 46.06-171.649 66.808-264.467 59.976zm-43.388-226.076c-15.06-4.05-25.23-13.05-46.24-40.919-43.436-57.619-118.108-168.647-123.076-183-6.987-20.186 9.505-42.5 31.41-42.5 7.685 0 14.962 3.177 24.465 10.68 16.273 12.849 23.847 18.688 39.329 30.321 33.632 25.271 73.752 53.006 76.65 52.987 1.946-.012 7.452-4.486 50.35-40.918C560.338 379.17 652.78 290.489 791.964 143.5c41.954-44.307 39.883-42.603 52.66-43.311 15.003-.831 27.514 10.054 29.088 25.312 1.072 10.385.348 11.626-47.552 81.499-113.274 165.236-207.728 286.69-304.067 390.985-7.374 7.983-30.1 31.212-50.5 51.62-40.126 40.14-43.168 42.605-57.492 46.577-7.923 2.197-21.296 2.306-28.989.237z' fill='%231acf15' transform='translate(-2)'/%3E%3C/svg%3E");

Почему код на странице правильно отображается во всех браузерах, кроме приложения Google Chrome на Realme 11 Pro +?

BLM21,

Сейчас вот владелец Realme 11 Pro+ домой придёт, буду пробовать игру флексов и гридов. А то при малейшем изменении всё пишу владельцу, чтобы обновил страницу и отписался мне.

угу, а там просто какой-нибудь дикий кэш каких-нибудь файлов стилей

Почему код на странице правильно отображается во всех браузерах, кроме приложения Google Chrome на Realme 11 Pro +?

BLM21, псевдо удобнее делать от sentence, а не от спана...