Multiple images in any element (div, table, span...) move outside of the container #2180
Open
Description
Dompdf version: v0.8.5
I couldn't believe what dompdf is doing but I guess I found a bug. Green is expected, red is an error.
Steps to reproduce:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Test</title>
<style>
table {
width: 100%;
border-collapse: collapse;
}
img {
border-radius: 50%;
}
</style>
</head>
<body>
<h2>Table</h2>
<table>
<tbody>
<tr>
<td style="background-color: lightgreen">
<img src="ok.jpg" />
</td>
<td style="background-color: #E6492D">
<img src="wrong.jpg" />
<img src="wrong.jpg" />
</td>
</tr>
</tbody>
</table>
<h2>div with 1</h2>
<div style="background-color: lightgreen">
<img src="ok.jpg" />
</div>
<h2>div with 2</h2>
<div style="background-color: #E6492D">
<img src="wrong.jpg" />
<img src="wrong.jpg" />
</div>
</body>
</html>Result
I tried everything I can but I din't find any css attribute that could fix this issue. I'm wondering what exactly pushes the images up as there are no styles applied.
I'm ready to sponsor a bug fix.
PS: Even the border radius is wrong as it should be a circle and not just a little round edges but that's another bug...