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

Здесь мы представили первый псевдо-элемент :after. В принципе, псевдо-элемент :after добавляет еще один дочерний элемент. Это не DOM (именно поэтому его называют псевдо-эллементом), так что это не настоящий дочерний элемент, но он полностью стилезуется, если вы добавите в качестве содержания один символ пробела.