我想在一个容器中设置div的样式，并给它一个位置：绝对。
父容器使用column-count = 3来布局元素。
这在Chrome和Firefox中运行良好，但Safari不能正确定位元素。
这是它在Chrome和Firefox中的外观：

这是Safari：

html,
    body {
        margin: 0px;
        min-height: 100%;
        height: 100%;
    }

    .app {
        display: flex;
    }

    .list-wrapper {
        margin-top: 25px;
    }

    ul li:first-child {
        margin-top: 0px;
    }

    ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
        column-gap: 0px;
        column-count: 3;
        column-width: 200px;
    }

    li {
        border: 1px solid black;
        margin: 4px;
        padding: 20px;
        overflow: hidden;
        break-inside: avoid-column;
    }

    h1 {
        height: 30px;
        min-height: 30px;
        line-height: 30px;
        width: 100%;
        margin: 0px;
    }

    li h1::before {
        content: "";
        position: absolute;
        width: 24px;
        height: 24px;
        border-radius: 50%;
        transform: translateY(-42px);
        background: #7fb8ff;
        border: 3px solid #0072ff;
        box-shadow: 0 0 4px #aaa;
    }

<div class="app">
        <div class="list-wrapper">
            <ul>
                <li>
                    <div>
                        <h1>Title 1</h1>
                        <p>Just some content</p>
                    </div>
                </li>
                <li>
                    <div>
                        <h1>Title 2</h1>
                        <p>Just some content</p>
                    </div>
                </li>
                <li>
                    <div>
                        <h1>Title 3</h1>
                        <p>Just some content</p>
                    </div>
                </li>
                <li>
                    <div>
                        <h1>Title 4</h1>
                        <p>Just some content</p>
                    </div>
                </li>
                <li>
                    <div>
                        <h1>Title 5</h1>
                        <p>Just some content</p>
                    </div>
                </li>
            </ul>
        </div>
    </div>

有人知道我该怎么补救吗？