Во-первых, не кроссбраузерно. Надо прописывать display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; Также кроссбраузерность нужна для этого свойства -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;
Если нужно на обычном ПК не на всю ширину, поставьте flex-grow: 0; Я пользуюсь более краткой записью flex: 0 1 32%;. Для примера зайдите на страницу
kstb26.ru/catalog/cement и посмотрите, как я реализовал это для карточки товара для ПК и планшета, а также для смартфона.
