使用typset.sh，我能夠通過blade生成PDF文檔。我試圖設置一個固定大小的???文件中的所有圖像，并把它們組織在一個網格中。

在這個PDF中，有10個圖像，8個可以放在一頁中，所以最后兩個移到第二頁。正確，但是，之前的兩個渲染在最后忽略了我為@page設置的邊距規則，這是我正在試圖修復的一個錯誤，請參見截圖:

以下是HTML:

<section id="images">
            @foreach ($record->incident_images as $image)
                <div class="image">
                    <img src="{{ asset('storage/' . $image) }}" />
                </div>
            @endforeach
        </section>

Typset設置文檔的CSS代碼:

@page {
            size: A4;
            margin: 10mm;
            /* bleed: 13mm; */

            @bottom-center {
                content: 'Page 'counter(page) ' of 'counter(pages);
            }
        }

這是圖片css:

section#images {
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 2mm;
            margin-top: 0; /* Adjust the top margin as needed */
            margin-bottom: 0; /* Adjust the bottom margin as needed */
        }

        .image {
            width: 100%;
            border: 1px solid black;
            break-inside: avoid; /* Ensure that each container stays together on a single page */
        }

        .image>img {
            width: 100%;
            height: 200vh; /* Set the image height to 50% of the viewport height */
            object-fit: cover;
        }

根據文檔，我嘗試使用分頁符，但問題仍然沒有解決:

分頁符控制 先斷后斷:這些屬性可以 用于指定應該或永遠不應該出現分頁符的位置 在元素之前或之后。 內部突破:此屬性可用于 防止元素中出現分頁符。 孤兒和寡婦:這些屬性可用于指定 必須出現在頁面頂部或底部、在頁面之前的行 允許休息。