Как отцентрировать блок в блоке?

Question

[Евгений]

Не получается отцентрировать новости. По факту тренируюсь создавая блок новостей. На старте должен были 3 столбца и 2 строки новостей.

Конкретно блок новостей не реагирует на margin:auto; даже с заданием конкретных размеров. Но как сделать их по центру? Без padding блока news__content

https://codepen.io/dunakov/pen/MxNzdo

Answer 1

[Eugene Chefranov]

Конечно margin не работает. вы ж его абсолютом сделали. Делайте флексами, контейнеру

display: flex; justify-content: center; align-items: center;

а внутреннему элементу необходимый размер.

Comments

[Евгений]

Забыл написать, что флексы юзать нельзя)

[Eugene Chefranov]

Евгений, тогда абсолютному блоку

.news__content {
    position: absolute;
    top: 70px;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
}

[Евгений]

И я убирал абсолютное позиционирование, это не помогало

[Евгений]

Eugene Chefranov, И transform запрещен) В общем нужно сначала сделать чисто на float-ах и position.

Answer 2

[ReActor Дмитрий Вершанский]

Пожалуйста

.news__content {
    width: calc(960px - 50px);
    position: absolute;
    top: 70px;
    right: 0;
    bottom: 0;
    left: 0;
    margin: 0 auto;
  }

Comments

[Евгений]

Тогда не будет работать уменьшение кол-ва блоков в строке (перепрыгивание под низ)

Ладно, я уже уточнил, там центрировал всё не нужно, так что лишний вопрос задал. Но лайки кину всем