I want a markdown that shows a picture on the left side, and to the right of it : price,name and address of fuelstation.
However i tried couple of things, but my picture is always on top, and the rest beneath it.
Whats wrong?
This is my code
type: markdown
content: >
<div style="display: flex; align-items: center; gap: 15px;">
<img src="{{ state_attr('sensor.carbu_com_super95_8300_price', 'entity_picture') }}" alt="Entity Image"
style="width: 100px; height: 100px; object-fit: cover; border-radius: 8px;">
<div>
<p><strong>Prijs:</strong> {{ states('sensor.carbu_com_super95_8300_price') }}</p>
<p><strong>Naam:</strong> {{ state_attr('sensor.carbu_com_super95_8300_price', 'supplier') }}</p>
<p><strong>Adres:</strong> {{ state_attr('sensor.carbu_com_super95_8300_price', 'address') }}</p>
</div>
</div>