Возможно ли одним fxFlex-ом добиться нужного вида?

Question

[Chvalov]

Необходимо получить такой результат:
Но проблема вот в чем:

1. Если в блоке fxLayout="row wrap" fxLayoutGap="25px"
   для элемента задать fxFlex="20", в строке вмещается 3 элемента, а не 4 из-за отступов fxLayoutGap в 25px
   
   В инспекторе смотрю для элемента задано max-width: 20%
   
   Думал решить проблему таким образом, fxFlex="calc(20% - 25px)", но в таком случае в инспекторе уже не максимальная ширина, а min-width: calc(20% - 25px); и вот что получается:
   
   
2. fxLayoutGap="25px grid" также не решает даной задачи, добавляет лишний горизонтальный скролинг

Как можно решить данную задачу ?
Код тут: https://stackblitz.com/edit/angular-j3pgzp

Comments

[Ivan Stroykin]

Хотели в одном проекте использовать fxFlex, поковырялись и поняли, что оно того не стоит - наняли верстальщика, который тоже "поплевался" и сделал всё сам. Получилось даже лучше с меньшим количеством оберток. Это наше мнение

[Chvalov]

Ivan Stroykin, Вы второй кто сегодня также негативно высказался в сторону fxFlex

[Ivan Stroykin]

Chvalov, А были положительные отзывы?

[Chvalov]

Ivan Stroykin, вот так чтоб кто-то в комментах или в реалии отзывался позитивно не встречал :(

Та и походить по вопросах которые люди задают в том же github или StackOverflow все сводится к тому что без костылей не обойтись.

Для себя решил отказать от fxFlex и вынести в глобальный scss файл нужные flex стили