mPDF - 内联块不并排显示答案

【问题标题】：mPDF - Inline blocks not displaying side by sidemPDF - 内联块不并排显示
【发布时间】：2015-08-14 00:53:30
【问题描述】：

我有一堆被格式化为内联块元素的小表格。在浏览器中，它们按预期并排显示，但是当使用 mPDF 输出它们时，它们会在每个表格之后中断。无论我如何尝试格式化它们，它们总是在表格之后中断。 mPDF 有什么技巧可以让元素并排堆叠吗？

我正在从页面中提取确切的 HTML 并通过 AJAX 发送它

以下是浏览器和 pdf 视图的示例。

我的 mPDF 生成器页面如下所示：

<?php
include("mpdf60/mpdf.php");

$html = $_POST['html'];

$mpdf=new mPDF('utf-8', 'A4');
$mpdf->SetDisplayMode('fullpage');

// LOAD a stylesheet
$stylesheet = file_get_contents('../../_css/main.css');
$mpdf->WriteHTML($stylesheet,1);    // The parameter 1 tells that this is css/style only and no body/html/text

$mpdf->WriteHTML($html);
$mpdf->Output('myPDF.pdf','D');

exit;
?>

【问题讨论】：

我们能看到 main.css 吗？看起来两个表的宽度都太大而无法将它们彼此对齐。请记住，我相信 mPDF 页面的宽度约为 800 像素。
这是我的第一个想法，所以我尝试将表格设置为 100 像素，但这并没有改变它们的行为。
奇怪！但是如果没有 CSS 文件，我们看不到太多东西。另外，您使用哪个版本的 mPDF？
我不相信 CSS 会有所帮助。我从上面的代码中删除了 CSS 文件并仅使用默认的 html 表格样式运行它（除了将表格内联样式设置为内联块元素）并且它显示相同。我使用的是 mPDF 6.0 版。

标签： javascript php css mpdf

【解决方案1】：

我也尝试了很多想法，但最终我找到了解决方案，只需使用：

float: left;

这对我有用。

【讨论】：

请注意，仅使用float: left; 是不够的，因为您需要在元素上显式设置宽度，如the docs 所述。

【解决方案2】：

我花了几个小时研究如何使用 mPDF 制作内联 <div> 或  元素。我找到了一些limitations，其中也包含内联块。 display: inline 或 display: inline-block 被忽略。如果您想看到它们并排放置，则必须将所有内容放在  元素中。

【讨论】：

谢谢兄弟，它对我有用test 1test 2 
@Sobir，作为 mPDF does not have support for inline-flex，这不可能对你有用。