Can I float an element to the top of its paragraph? - css

Question

I'm trying to find a way to float an image to the top of the paragraph it comes after. It must come after the text of the paragraph in the HTML, such that screen readers and small screens (with the image not floated due to media queries) see the image after the text of the paragraph. I can put the <img> inside or outside the <p>, but it must be after the text.
Is there a way to make the image appear at the top right of the text of the paragraph, and have the text of the paragraph appropriately wrap around the image, using only CSS?
[...document.querySelectorAll('img')].forEach(img => {
const rand = Math.floor(Math.random() * 300 + 100);
img.setAttribute('src', `https://placekitten.com/150/${rand}/`);
img.setAttribute('height', rand);
});
img {
float: right;
width: 150px;
height: auto;
}
body {
display: flex;
}
<div class="inside">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec posuere odio in tincidunt posuere. Phasellus id lectus erat. Proin sollicitudin tortor risus, vel tincidunt est accumsan id. Donec urna erat, interdum in elit sit amet, egestas ullamcorper tortor. Nam a leo nec lectus varius tristique. Cras et erat ac lectus auctor interdum. Ut eros tellus, interdum a rutrum vitae, rutrum ac ex. Curabitur aliquet purus libero, in porttitor dui egestas non. Pellentesque ex dui, commodo vitae lectus non, aliquam pretium mauris. Etiam viverra imperdiet sem et vestibulum. Aenean eu sapien eget diam tincidunt sagittis vitae ac turpis. Praesent nec libero condimentum, imperdiet lorem et, semper lectus. Curabitur ac erat eu neque volutpat aliquam sit amet ut nisi. Sed vestibulum augue arcu, at luctus urna dignissim at. Vestibulum pretium consequat erat vel placerat. Phasellus id lectus erat. Proin sollicitudin tortor risus, vel tincidunt est accumsan id. Donec urna erat, interdum in elit sit amet, egestas ullamcorper tortor. Nam a leo nec lectus varius tristique. Cras et erat ac lectus auctor interdum. Ut eros tellus, interdum a rutrum vitae, rutrum ac ex. Curabitur aliquet purus libero, in porttitor dui egestas non. Pellentesque ex dui, commodo vitae lectus non, aliquam pretium mauris. Etiam viverra imperdiet sem et vestibulum. Aenean eu sapien eget diam tincidunt sagittis vitae ac turpis. Praesent nec libero condimentum, imperdiet lorem et, semper lectus. Curabitur ac erat eu neque volutpat aliquam sit amet ut nisi. Sed vestibulum augue arcu, at luctus urna dignissim at. Vestibulum pretium consequat erat vel placerat. Phasellus id lectus erat. Proin sollicitudin tortor risus, vel tincidunt est accumsan id. Donec urna erat, interdum in elit sit amet, egestas ullamcorper tortor. Nam a leo nec lectus varius tristique. Cras et erat ac lectus auctor interdum. Ut eros tellus, interdum a rutrum vitae, rutrum ac ex. Curabitur aliquet purus libero, in porttitor dui egestas non. Pellentesque ex dui, commodo vitae lectus non, aliquam pretium mauris. Etiam viverra imperdiet sem et vestibulum. Aenean eu sapien eget diam tincidunt sagittis vitae ac turpis. Praesent nec libero condimentum, imperdiet lorem et, semper lectus. Curabitur ac erat eu neque volutpat aliquam sit amet ut nisi. Sed vestibulum augue arcu, at luctus urna dignissim at. Vestibulum pretium consequat erat vel placerat.
<img src="https://placekitten.com/150/200" width="150" height="200" alt="Cat">
</p>
</div>
<div class="outside">
<p>
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec posuere odio in tincidunt posuere. Phasellus id lectus erat. Proin sollicitudin tortor risus, vel tincidunt est accumsan id. Donec urna erat, interdum in elit sit amet, egestas ullamcorper tortor. Nam a leo nec lectus varius tristique. Cras et erat ac lectus auctor interdum. Ut eros tellus, interdum a rutrum vitae, rutrum ac ex. Curabitur aliquet purus libero, in porttitor dui egestas non. Pellentesque ex dui, commodo vitae lectus non, aliquam pretium mauris. Etiam viverra imperdiet sem et vestibulum. Aenean eu sapien eget diam tincidunt sagittis vitae ac turpis. Praesent nec libero condimentum, imperdiet lorem et, semper lectus. Curabitur ac erat eu neque volutpat aliquam sit amet ut nisi. Sed vestibulum augue arcu, at luctus urna dignissim at. Vestibulum pretium consequat erat vel placerat. Phasellus id lectus erat. Proin sollicitudin tortor risus, vel tincidunt est accumsan id. Donec urna erat, interdum in elit sit amet, egestas ullamcorper tortor. Nam a leo nec lectus varius tristique. Cras et erat ac lectus auctor interdum. Ut eros tellus, interdum a rutrum vitae, rutrum ac ex. Curabitur aliquet purus libero, in porttitor dui egestas non. Pellentesque ex dui, commodo vitae lectus non, aliquam pretium mauris. Etiam viverra imperdiet sem et vestibulum. Aenean eu sapien eget diam tincidunt sagittis vitae ac turpis. Praesent nec libero condimentum, imperdiet lorem et, semper lectus. Curabitur ac erat eu neque volutpat aliquam sit amet ut nisi. Sed vestibulum augue arcu, at luctus urna dignissim at. Vestibulum pretium consequat erat vel placerat. Phasellus id lectus erat. Proin sollicitudin tortor risus, vel tincidunt est accumsan id. Donec urna erat, interdum in elit sit amet, egestas ullamcorper tortor. Nam a leo nec lectus varius tristique. Cras et erat ac lectus auctor interdum. Ut eros tellus, interdum a rutrum vitae, rutrum ac ex. Curabitur aliquet purus libero, in porttitor dui egestas non. Pellentesque ex dui, commodo vitae lectus non, aliquam pretium mauris. Etiam viverra imperdiet sem et vestibulum. Aenean eu sapien eget diam tincidunt sagittis vitae ac turpis. Praesent nec libero condimentum, imperdiet lorem et, semper lectus. Curabitur ac erat eu neque volutpat aliquam sit amet ut nisi. Sed vestibulum augue arcu, at luctus urna dignissim at. Vestibulum pretium consequat erat vel placerat.
</p>
<img src="https://placekitten.com/200/200" width="200" height="200" alt="Cat">
</div>