I'm trying to generate shipping labels with Laravel-DomPDF on Laravel 10. My idea is to have two columns and print in ordrer from left ro right with 1x1, 1x2, 2x1 etc... The HTML template is obviously correct but when I generate the PDF, I can't get the arrangement I want.
I tried with grid, inline-block and floats. Here is my code
<!DOCTYPE html>
<html lang="fr">
<head>
<meta charset="UTF-8">
<title>Etiquettes A4</title>
<style>
.etiquettes-container {
width: 100%;
}
.etiquette {
width: 40%;
height: 150px;
border: 1px solid #ccc;
padding: 10px;
font-family: sans-serif;
font-size: 14px;
border-radius: 5px;
margin-bottom: 20px;
float: left;
margin-right: 5%;
}
.etiquette:nth-child(2n) {
margin-right: 0;
}
.nom {
font-weight: bold;
margin-bottom: 5px;
}
.adresse {
line-height: 1.6;
}
</style>
</head>
<body>
<div class="etiquettes-container">
@foreach ($etiquettes as $etiquette)
<div class="etiquette">
<div class="nom">{{ $etiquette['name'] }}</div>
<div class="adresse">{{ $etiquette['address'] }}</div>
</div>
@endforeach
</div>
</body>
</html>
And the method :
public function generatePDF() {
$data = [
'title' => 'Etiquettes à Imprimer',
'etiquettes' => [
['name' => 'Nom 1', 'address' => 'Adresse 1'],
['name' => 'Nom 2', 'address' => 'Adresse 2'],
['name' => 'Nom 3', 'address' => 'Adresse 3'],
['name' => 'Nom 3', 'address' => 'Adresse 3'],
]
];
$pdf = Pdf::loadView('pdf.etiquette', $data);
$pdf->setPaper('a4', 'portrait');
return $pdf->stream('etiquette.pdf');
}
Thanks !