Как выровнять блоки по горизонтали при уменьшении экрана?

Question

[Никита Воробьев]

При уменьшении экрана срабатывает сетка бутстрапа, но блоки находятся не совсем так как хотелось. Необходимо чтобы они располагались в центре по горизонтали. Долго пытаюсь исправить, но я новичок в верстке и у меня ничего не получилось. Прошу помощи, заранее спасибо!
Ссылка

Answer 1

[CODALSD]

Попробуйте так.
1 вариант => Для родительского row центрируем содержимое и news-block убираем ширину в 100%

.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  justify-content: space-around;
}
.news-block {
    position: relative;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    max-width: 100%;
    flex-grow:1;
}

2 вариант

.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px;
  justify-content: space-around;
}
.news-block {
    position: relative;
    width: 100%;
    min-height: 1px;
    padding-right: 15px;
    padding-left: 15px;
    flex: 0 0 100%;
    max-width: 315px;
}

Answer 2

[Дмитрий Гончаров]

Тык
text-align: center; для Row
для title margin: 0 auto;

Comments

[Никита Воробьев]

Текст центрируется, а в макете этого нет - текст прижат к левой границе блока :(

[Дмитрий Гончаров]

Никита Воробьев, Убери margin 0 auto