How to make lists wrap around an image inside a PDF generated from HTML?

Question

PDF

There is a WordPress site with a plugin: DK PDF which generates PDF files for posts.
Everything works fine, except that UL(OL) lists don't want to "wrap around" the image from the left and right sides.
Here is an example code:

<h3>Приготовление:</h3>
<img class="size-medium wp-image-2241 alignright" src="http://ast.partizzan.ru/wp-content/uploads/2017/07/pop2-300x182.jpg" alt="" width="300" height="182" />
<ol>
 	<li>Изначально разморозьте и промойте брокколи в большом количестве воды, разберите на веточки.</li>
 	<li>Подготовленную капусту отправьте в разогретую сковородку, влейте водицу, посолите и тушите треть часа на минимальном огне.</li>
 	<li>В сковородку отправьте сметану, перемешайте и готовьте пять минут.</li>
 	<li>Подавая к столу, тушеные брокколи посыпьте специями и разложите в порционные тарелки.</li>
</ol>
Для ускорения размораживания брокколи достаньте из упаковки, выложите в глубокую посуду и залейте водой. Позже воду слейте, а капусту после мойки используйте по назначению

This is how everything looks on the site:

and this is how it is in the PDF file:

as you can see, point 2 does not become immediately after the 1st - but I would like it to be exactly like that!
The plugin itself has the following CSS code:

.alignright {
    float: right;
    margin: 10px 0px 10px 20px;
}
.alignleft {
    float: left;
    margin: 10px 20px 10px 0px;
}

can anyone come across? how to solve?

Answer 1

try inline