I'm struggling to get a p tag vertically aligned next to an image. The issue is that only the first line of text aligns properly. How can I make the text in the p tag wrap around the image while maintaining vertical alignment?
Here is the HTML code:
<body>
<div class="blog">
<div class="post">
<img src="https://dummyimage.com/600x400/a3b5c4/000000.jpg&text=example+of+donation+feed">
<p>“Once someone dreams a dream, it can't just drop out of existence. But if the dreamer can't remember it, what becomes of it? It lives on in Fantastica, deep under earth. There are forgotten dreams stored in many layers. The deeper one digs, the closer they are. All Fantastica rests on a foundation of forgotten dreams.”</p>
</div>
</div>
</body>
And the CSS code:
<style>
.blog img {
vertical-align: middle;
}
.blog p {
display: inline;
}
</style>