Как запретить наложение div с position: fixed друг на друга?

Question

[Vadim Kinev]

Всем привет! Есть JS код, который проверяет формы на заполненность, ошибки и так далее. Ошибки формы нужно выводить в правом верхнем углу экрана. В некоторых случаях выводится массив ошибок и соответственно их несколько.

Есть такой CSS код:

.alert_warn.right {
    position: fixed;
    right: 20px;
    top: 20px;
    display: block;
    transform: unset;
    opacity: 1;
    z-index: 9999;
    background: #fff;
}

Этот код позицинонирует их в правом верхнем углу, но если ошибок выводится несколько, то они накладываются друг на друга. Как это можно исправить?

Comments

[Максим]

ни как

[WbICHA]

Сдвигай старые ошибки ниже.

Answer 1

[Алексей Ярков]

Сделать им общий контейнер и выстраивать все дочерние элементы в столбик.

Comments

[Владимир]

Доскажу несказанное. fixed - общий контейнер, сообщения внутри - наверное флекс

Answer 2

[Rsa97]

Позиционирование fixed всегда будет размещать блок по абсолютным координатам экрана.
Могу посоветовать разместить в нужном месте блок-обёртку, в который добавлять дочерние блоки с предупреждениями.