Laravel Barryvdh\DomPDF 两个不同高度的行内块 div

Question

我有问题。我想制作一个 pdf，但我不能在不同高度的 div 上制作一个简单的 flex 和 items-center。

 <div style="margin-top: 20px; align-items: center">
        <div style="width: 70%; display: inline-block; text-align: right">Client: </div>
        <div style="width: 25%; display: inline-block; font-size: x-large" >Company shorted name</div>
 </div>

Answer 1

好的，您的问题与 Laravel 和 DomPdf（将调整您的标签:-)）都没有关系。

然而，这就是让 2 个元素居中的方法；中心恰好位于 2 个子 DIV 之间，因此您可能希望通过给它们一定的大小来调整它，而不是自动。

<div style="margin-top: 20px; display: flex; justify-content: center;flex-direction: unset;width: 100%;align-items: center;">
  <div style="flex: 1;display: inline-block;text-align: right;">Client: </div>
  <div style="flex: 1;display: inline-block;font-size: x-large;">Company shorted name</div>
</div>

作为参考你应该看看这篇文章https://love2dev.com/blog/absolute-centering-css/

Laravel Barryvdh\DomPDF 两个不同高度的行内块 div

Laravel Barryvdh\DomPDF Inline block two different height div

html

css

dompdf

laravel