将 Flex/CSS 与 wkhtmltopdf 一起使用

Question

我已经使用以下答案在我的 HTML 页面上使用 flexbox 成功创建了一个列表 如何在 flexbox 中每行显示 3 个项目？

我需要用这些数据创建一个 PDF，我正在使用 wkhtmltopdf ( https://wkhtmltopdf.org/ )，它也可以正常工作，但是生成的 PDF 将我的所有列表项都放在 1 个长列中，而不是每行 3 个。

看起来在生成 PDF 时没有处理 CSS 任何见解都值得赞赏。

原文由 UserSN 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 1

这对我有用：

 .row {
    display: -webkit-box; /* wkhtmltopdf uses this one */
    display: flex;
    -webkit-box-pack: center; /* wkhtmltopdf uses this one */
    justify-content: center;
}

.row > div {
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    flex: 1;
}

.row > div:last-child {
    margin-right: 0;
}

有关详细信息，请参阅 https://github.com/wkhtmltopdf/wkhtmltopdf/issues/1522 。

原文由 Rajian 发布，翻译遵循 CC BY-SA 4.0 许可协议

Answer 2

我使用以下方法解决了这个问题：

相当于 display:flex; ==> display: -webkit-box;

相当于 justify-content: space-between; ==> -webkit-box-pack: justify;

一些有用的信息来自： https ://github.com/wkhtmltopdf/wkhtmltopdf/issues/1522

原文由 raphael-allard 发布，翻译遵循 CC BY-SA 4.0 许可协议