I use barryvdh/laravel-snappy to generate pdf and need to create a signature area in my pdf doc. There must be two signature fields because it's a contract pdf but when I use css grid or flex they place one under the other. How to place them side by side?
<div class="flex-container" style=" display:flex;
padding: 10px;">
<div class="flex-item" style="padding: 20px; text-align: center;">
<h2 style="text-decoration:underline">sign1</h2>
</div>
<div class="flex-item" style="padding: 20px; text-align: center;">
<h2 style="text-decoration:underline">sign2</h2>
</div>
</div>
<div class="flex-container" style=" margin: auto; display:table;
padding: 10px;border:1px solid red">
<div class="flex-item" style="padding: 20px; text-align: center;background-color: blue; display: table-cell">
<h2 style="text-decoration:underline">sign1</h2>
</div>
<div class="flex-item" style=" margin: auto; padding: 20px; text-align: center;background-color: green; display:table-cell">
<h2 style="text-decoration:underline">sign2</h2>
</div>
</div>
True, I tried to convert HTML with flex to PDF. The two containers go on two lines. My advice is to use 'display:table' to '.flex-container' and 'display: table-cell' to '.flex-item. That worked out for me.