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

Проще всего флаг сделать по классу и фоном псевдоэлемента. А не двумя дивами.
И разметка проще и кастомному селекту тоже. Просто кроме текста возьмете и класс.

Как в CSS сделать заливку на половину объекта с закруглением?

Даже интересно, как это связано с градиентом

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

Если подписи в одну строку, то проще всего добавить для псевдо

display: inline-block;
vertical-align: middle;

Если нет, то абсолютами либо флексами или гридами.
В случае флексов или гридов, нужно либо быть уверенным, что в тексте нет тегов (span, strong, br и т.д.) либо использовать доп обертку для текста.

Сами иконки выгоднее вставлять в background, а content оставлять пустым. Так проще управлять размером.

Как выровнять ячейки по центру и зафиксировать?

newokek, покажите в песочнице на codepen.io как так оно вам не помогло.
Если что, это для обертки этих инпутов.

Что делать с таким фоном?

IIIu6ko, можно и так, сохраните десяток вариантов для разных media и ретины и пойдет.

Что делать с таким фоном?

IIIu6ko, я же написала про блюр и тормоза.
Если тормозов нет, то и норм.

Почему не работают падинги?

Mark321,
Это у вас блок малоадаптивный. Ширина фиксирована, высота ограничена. Сделаете сам блок адаптивным, будет хорошо.

Размер текста определяется блоком.
Количество строк да, указываете вы.
Но можно макс высоту указывать в em с учетом line-height, чтобы ровненько всё было.

Изменение значения gap в зависимости от ширины экрана (адаптив) через миксины?

Почитайте про clamp https://developer.mozilla.org/ru/docs/Web/CSS/clamp
К этому миксину не имеет отношения, но вам понравится.

Почему не работают падинги?

Mark321, обычно ставят многотичие с помощью text-overflow ellipsis или js'ом или прилетает с бэка.
Хорошо бы ещё пользователю намекнуть, что нужно сделать, чтобы увидеть остальной текст.
Причем, не забыть пользователей без мышки и читалки.

Почему не работает inline-block?

Front-Den, пользуйтесь валидатором https://validator.w3.org/nu/
Почините разметку, всё получится.

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

Это .promo .promo_text избыточные селекторы. Достаточно просто .promo_text.
И в аналогичных случаях.

<div class="waiting_divider"></div> если вам хочется вставить пустой тег в разметку, то с очень большой вероятностью, вы делаете что-то не то. Если так поступает автор курсов, то вы точно делаете что-то не то.

Почему-то я думаю, что вы смотрите не совсем свежие и не вполне качественные (судя по селекторам и дивайдерам) курсы.

Почему не работают падинги?

Mark321, чтобы обрезался, нужно использовать overflow: hidden.
Чтобы остались отступы, нужна доп обертка или имитация отступов с помощью, например, бордеров.

Почему не работают падинги?

А куда должен деваться текст, который не поместился в ваши 112px?

как это исправить, подскажите пожалуйста

Убрать ограничение по высоте.

Как сделать чтобы при нажатии на h3 копировался текст?

Так

Как узнать о переполнении?

Дмитрий, не усугубляйте ))

И давайте так: вы расскажете всю задачу и мы попробуем помочь вам найти к ней то самое изящное или признаем, что кроме банального сравнения размеров делу не помочь :)

Что делать с таким фоном?

IIIu6ko, так и делать. Взять картинку, поверх наделать градиентов.
Можно собрать все кругляхи в одну SVG, но если там много блюра, то браузер может быть недоволен.

Только не забудьте убрать clip-content с оберток в фигме, чтобы ничего не обрезалось. А потом отредактируйте фрейм так, чтобы он был симметричен относительно центра, а по верху обрежьте по верху страницы.

Как узнать о переполнении?

Дмитрий, да вы не огрызайтесь. Никто же не запрещает использовать костылики. Все время от времени городят черти что в коде.

Но возможно есть и более изящные и быстрые способы...

Особенно, если эти костылики кажутся вам изящными.

Простите, хотела удержаться, но не смогла :)

Как узнать о переполнении?

Дмитрий,

найдя этот пример, я просто собирался прочитать у родителя свойство bg (ну или другое) через getComputedStyle

знатный костыль

Как узнать о переполнении?

Дмитрий,

какое это имеет значение?

На этом сервисе полно спрашивающих не в состоянии идентифицировать проблему. Т.е. им кажется, что они не могут справится с какой-то проблемой. А на самом деле, этой проблемы не было бы вовсе начни они решать задачу другим способом. В вашем случае это могла бы быть задача многострочного text-overflow ellipsis или просто overflow или что-то аналогичное.

Ваша проблема решается на js путем сравнения двух (или четырех, в зависимости от верстки) размеров.
Либо с помощью IntersectionObserver (подходит ли для вашей задачи тоже зависит от верстки) https://habr.com/ru/post/494670/

Как при наведении курсором на изменять цвет сразу у двух?

newokek, удачи в изучении :)
Не забывайте про семантику и доступность.

Как узнать о переполнении?

Существует ли лаконичный способ идентифицировать переполнение блока содержимым?

Смотря зачем