Как правильно учесть отступы?

Question

[fantastikgodd]

если делать таким образом (заданием врапперу отрицательные margin), то будет белая полоса

как всё правильно посчитать и указать?

https://jsfiddle.net/2hju876f/1/

Comments

[Максим]

а что требуется сделать ?

[fantastikgodd]

Максим Ленский, по 3 итема в ряд
с горизонтальными отступами по 40 пикселей

[Максим]

fantastikgodd, то есть по краям и так же между каждым item должно быть 40px ?

[fantastikgodd]

Максим Ленский, +

[fantastikgodd]

Максим Ленский, вроде будет проблема, если еще итем добавить (4 итем)

[Максим]

fantastikgodd, в вопросе про три item даже если 4 тоже не проблема но лучше такое отдавать браузеру - то есть делать автоматические отступы - justify-content: space-around -таким способом браузер сделает равномерные отступы

[fantastikgodd]

Максим Ленский, имелось ввиду, что четвертый итем будет переноситься на новую строку

[fantastikgodd]

fantastikgodd, тоесть 3 итема
потом опять три
и тд

[Yupiter7575]

fantastikgodd, Тогда добавляете flex-wrap

[Максим]

fantastikgodd, хоть 1000 добавляйте

[fantastikgodd]

Ankhena, так нормально?
https://jsfiddle.net/tjnwy8pb/3/

[fantastikgodd]

Ankhena, или через overflow - тоже можно?
для .block
https://jsfiddle.net/5xgfh13n/

[Ankhena]

fantastikgodd,

или через overflow - тоже можно?
для .block

не очень понятно зачем столько оберток и зачем для block overflow. Что с ним, что без него, разницы нету. Ну кроме того, что outline теряется :)

так нормально?

Если с макетом совпадает, то нормально.

[fantastikgodd]

Ankhena, для block overflow - чтобы из-за отрицательных маргинов не было прокрутки

[Ankhena]

fantastikgodd, у контейнера паддинг 15, у wrap отрицательный margin тоже 15.
Что там может выпирать из block?