This question has already been answered:

Attention, the question. Container width = 1170px, width of one block wrapper = 291,3px. 1170> 291.3 * 4, and the fourth block in no way wants to be placed next to the first three (with wrapper {max-width: 25%}, reducing is not an option). Why is this so?

@media only screen and (min-width : 979px) { .wrapper { width: 25%; } } .container { max-width: 75%; margin: 0 auto; padding: 0; }

Reported as a duplicate by Qwertiy ♦ , aleksandr barakin , user207618, Community Spirit ♦ Jun 24 '17 at 10:53 .

A similar question was asked earlier and an answer has already been received. If the answers provided are not exhaustive, please ask a new question .

  • one
    What about indents? .. - Mikhail Rebrov
  • and attach, please, the corresponding css blocks and an excerpt of the html-code. - Mikhail Rebrov
  • ru.stackoverflow.com/a/468550/178988 - Qwertiy ♦

1 answer 1

Have you considered this distance?

enter image description here

The simplest solution:

 wrapper { max-width: calc(25% - 5px); /* увеличивайте с 5px до 10px, если все равно вылазит... */ }
  • can you somehow remove / change the distance that you noted? container and wrapper have margins and paddings 0 are - ur pride
  • @urpride code add, I'm not Vanga so ... - MihailPw
  • @media only screen and (min-width: 979px) {.wrapper {width: 25%; }} - ur pride
  • .container {max-width: 75%; margin: 0 auto; padding: 0; } - ur pride
  • @urpride Edit the question to add code humanly - MihailPw