Как сделать отступ между position: absolute блоками?

Question

[valexeich]

У меня несколько блоков с position: absolute находятся друг на друге, как сделать отступы между ними?



Вот код:

<template>
        <div class="block">
                <div class="imgbx">
                    <img src="https://inews.gtimg.com/newsapp_bt/0/14511251306/1000" class="cover">
                </div>
                <div class="details">
                    <div class="listHead">
                        <h4>Test</h4>
                        <p class="time">12:32</p>
                    </div>
                    <div class="message_p">
                        <p>hi</p>
                    </div>
                </div>
            </div>
        
        <div class="block">
                <div class="imgbx">
                    <img src="https://inews.gtimg.com/newsapp_bt/0/14511251306/1000" class="cover">
                </div>
                <div class="details">
                    <div class="listHead">
                        <h4>Test2</h4>
                        <p class="time">12:35</p>
                    </div>
                    <div class="message_p">
                        <p>hello</p>
                    </div>
                </div>
            </div>
</template>

.block {
    position: absolute;
    width: 20%;
    display: flex;
    bottom: 0;
    right: 0;
    margin-right: 10px;
    margin-bottom: 10px;
    align-items: center;
    padding: 15px;
    border-bottom: 1px solid rgba(0, 0, 0, 0.06);
    cursor: pointer;
    background: #2d3044;
}

Comments

[Ankhena]

Сложить в один блок и сделать между ними отступы.

[valexeich]

Ankhena, добавил это и не помогло <div style="margin-bottom: 20px;"></div>

[Denis Melnikov]

valexeich, котнейнер сделайте абсолютным, а там уже свои блоки выводите.

[valexeich]

Denis Melnikov, спасибо помогло

[Ankhena]

valexeich, да оно и не должно было.
Я же написала, сложите в один block и там расставляйте как вам нужно.