ehoboli, ок. Я написала алгоритм.
Что из этого вы можете сделать/нагуглить, а что нет?
Пока у вас нет ни намека на какие-то пробы и тогда это задание, а не вопрос.
Что конкретно у вас не получается?
Разбейте задачу на мелкие:
1. Узнать высоту блока
2. Сравнить два значения
3. Написать условие
4. Показать блок
5. Скрыть блок
6. Проверять при перестроениях
LI4NOOST, вариант без обертки не очень хорошо живет при адаптиве. Но раз удаление обертки помогло, то скорее всего проблемы были с её стилями. Старайтесь делать песочницы с видимой проблемой на codepen.io или аналогах, так вы быстрее получите ответ и он будет более точным, а не предположения.
SherbakovFirst, плагин действительно называется autoprefixer, с этой частью вопроса вы справились самостоятельно.
Ваши "вебкиты" это вендорные префиксы. Погуглите что это и зачем.
Кроссбраузерность лучше всего проверять в разных браузерах и на разных устройствах (в офисе, у друзей, знакомых и т.д.).
Но есть и специальные сервисы типа Browserstack. Бесплатно 30 секунд на каждый браузер/устройство.
1. псевдо с радиальным градиентом
2. псевдо и border-radius
3. clip-path
4. белая svg в псевдо