Как лучше делать адаптивные размеры у блоков не имеющих font-size?

Михаил Оловянников, если совсем best, то делать так, чтобы если пользователь поставит увеличенный шрифт в браузере, то он срабатывал бы.
Правда, при этом вряд ли все отступы будут зависеть от размера шрифта. Но зависит от макета. Я бы проконсультировалась у дизайнера, что делать в конкретных случаях.

Как лучше делать адаптивные размеры у блоков не имеющих font-size?

Хотел поинтересоваться: как правильно делать адаптивные размеры (конкретно padding и margin) у блоков, внутри которых нет текста и соответственно font-size?

Но бывает так, что надо задать padding секции (section)

И почему это у секции нет ни контента ни font-size? Куда шрифт-то делся? Может это не секция вовсе?

Обычно у секций font-size наследуется от body или других родителей. Оттуда и пляшите. Раз уж от font-size хотите.

от определенных пикселей до определенных пикселей так сказать

Для этого есть clamp.

Также есть единицы измерения от вьюпорта и от контейнера.
Может они вам больше подойдут?

Как стилизовать данную фигуру?

На базе вот этого можно попробовать, если красный тоже наклонить. И добавить обертку для текста. Либо текст вынуть и прибить сверху. Только гридом, а не абсолютом.
https://jsfiddle.net/Ankhena/bo2d1ug7/1/

Как создать маску над основным изображением?

Просто обычный градиент, без абсолютов и clip-path

Правильно ли я написал html разметку по БЭМ?

Schenker,

Если да, то они ведь имеет смысловую нагрузку

Какую ещё смысловую нагрузку они несут? Веб деволопмент, по-вашему, так выглядит? Квадратик на ножке? И если его заменить на другую иконку или вообще убрать, то смысл потеряется?

Как оформить такой список?

rinatoptimus,

Как правильно это сделать?

Поставить p после списка с цветами.
Может, это вообще кнопка? Или это просто сообщение, что они есть, но фик знает какие?

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

akmalbozor1965, в textarea нельзя вставить br. Но можно в conteneditable true.
Если речь об обработке текста из textarea и вставке в другой тег, то и считайте символы, js прекрасно с этим справляется.

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

Что-то мне кажется, что истинная задача звучит не так

Правильно ли я написал html разметку по БЭМ?

Schenker, по БЭМу лучше. Остальное без изменений.

а что именно в макете является декором?

Вы на полном серьезе не видите что украшения, а что контент?
https://htmlacademy.ru/blog/html/content-or-decor-img

Украшения отправляются в стили: фоны, псевдо и т.д.

Правильно ли я написал html разметку по БЭМ?

Schenker,
1. Декор = декоративный элемент
2. По смыслу и сути происходящего

Как сверстать наслаивающийся блок чтобы у него сохранялась высота?

Ivan Ustûžanin, ну нет, далеко не только. Да и начальное положение может быть разным, как один под другим, так и рядом.
Но гридом удобно, тут не поспоришь.

Правильно ли я написал html разметку по БЭМ?

Проверить правильную физическую вложенность классов можно тут https://yoksel.github.io/html-tree/

Но
1. БЭМ не отменяет семантику, а у вас дивянка. И от части тегов можно вообще избавиться.
2. Декоры не вставляют тегами img или, если по-другому никак, скрывают от скринридеров.
3. Классы типа top, down, red, blue плохо переиспользуются и сильно хромают при адаптиве, смене тем и т.д.
4. Можно избавиться от значительной части слов в классах. Например, использовать item только там где сам item, в дочерних это слово убрать. Если оно оттуда не убирается логически, значит, item это блок, а не элемент и вложенные элементы это его элементы, а не родительского.
expertise__item-text -> expertise__text

С какой величины поддержки CSS-свойство можно использовать?

Неужели самому не очевидно?

Например, свойство поддерживают 80% браузеров, можно ли при такой поддержке использовать нововведения?

Можно,
если целевая аудитория не использует остальные 20% браузеров
или пофик на тех, кто всё же использует
или если свойство отвалится, то будет просто чуть менее красиво.

Как сверстать наслаивающийся блок чтобы у него сохранялась высота?

Ещё вариант большой паддинг, потом отрицательный margin или relative у левого блока.

Как сверстать наслаивающийся блок чтобы у него сохранялась высота?

DZHAMBUALT, три строки, каждый элемент занимает по 2.
auto 200px auto
скорректируйте как надо

Как сверстать наслаивающийся блок чтобы у него сохранялась высота?

Банальный отрицательный margin

Либо гриды

Как синхронизировать направления движения в слайдере Swiper?

По-моему, у вас и в вопросе перепутаны право и лево и, вероятно, стрелки в слайдере.
Но песочницы с примером нет - можно и не гадать.

Как сделать квадратное отверстие со скруглёнными краями в углу div элемента?

Отверстия не вижу, но вот только что такой же вопрос
Как сделать такую маску в CSS?
и ещё сотня таких на этом ресурсе

Как сделать линию не на всю ширину?

Сделать комбинацию из радиального и линейного градиентов. Линия-то со скруглениями.

Умнее взять SVG и не парится. Можно заинлайнить в CSS.

Как сделать такую маску в CSS?

Псевдо с радиальными градиентами или svg и drop-shadow

Можно поискать по моим ответам/комментариям, уже несколько раз давала целый комплект ссылок на песочницы с решениями.