Здравствуйте,
пытаюсь правильно сверстать компонент группы кнопок, использую flexbox. У компонента может быть 2 стиля - без зазора и с зазором между кнопками. Не понимаю, как правильно сделать через CSS зазоры между кнопками. Первое что пришло на ум, это использовать отрицательные маржины у группы и положительные паддинги у кнопок, но margin у блока группа кнопок менять нельзя (блок не должен влиять на своё "положение", есть ситуация когда маржин задаётся примиксованным элементом). Второе что приходит на ум - это маржин справа у каждой кнопки кроме последней и маржин снизу у всех кнопок. Минус такого решения - есть "лишний" отступ снизу или "лишний" отступ справа, если последняя кнопка перенеслась на новую строку при сжатии экрана. Третий вариант который я пробовал - это использовать CSS Grid, но в данном случае это вообще не вариант...
Помогите, пожалуйста, понять, как правильно сверстать такой блок.
Первое, что пришло в голову: добавлять «распорку» каждой кнопке с помощью
:after
или завернуть всю группу в дополнительную обертку, от которой внутри плясать.