Can't figure out how to wrap text under an image

Basically, what I want to achieve is this (1st image): https://prnt.sc/EO_CIn76U9UT The closest I can get to my desired result is with flex - which results in this (2nd image): https://prnt.sc/kyvUnM2vIww4 Source to my closest result:
<div className="flex">
<Avatar className="h-6 w-6">
<AvatarImage src="https://github.com/shadcn.png"/>
<AvatarFallback>ABC</AvatarFallback>
</Avatar>
<span className="text-sm"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Ab, laudantium? Excepturi iure corrupti adipisci debitis, laborum ad quae magni? Lorem ipsum dolor sit amet.
</span>
</div>
<div className="flex">
<Avatar className="h-6 w-6">
<AvatarImage src="https://github.com/shadcn.png"/>
<AvatarFallback>ABC</AvatarFallback>
</Avatar>
<span className="text-sm"> Lorem ipsum dolor sit amet consectetur adipisicing elit. Ab, laudantium? Excepturi iure corrupti adipisci debitis, laborum ad quae magni? Lorem ipsum dolor sit amet.
</span>
</div>
Any help is appreciated! :)
Lightshot
Screenshot
Captured with Lightshot
Lightshot
Screenshot
Captured with Lightshot
A
Asappiโ€ข15d ago
oh, and adding flex-wrap to the div doesn't help
M
Mannixโ€ข15d ago
thats a job for a float ๐Ÿ™‚
แผ”ฯฯ‰ฯ‚โ€ข15d ago
^ don't forget to clear:both
A
Asappiโ€ข15d ago
Thank you! โค๏ธ would've never thought of using float ๐Ÿ˜…
Want results from more Discord servers?
Add your server
More Posts
How to add stuff off of my sidebarI want to add stuff on the right side of my website but it isnt showing upUsing escaped unicode in contentIs it possible to use escaped unicode in content to get emoji combinations like Phoenix for example,Github blocked push due to secretsIt was right, my `rest.http` file was misspelt in my `gitignore`. But now it's correct and git is Trying to get the cards over each other properlyI want to set the back-card under the front-card with wider and shorter than the front-card, but couOverflow Issuehttps://w5bkz10l-3000.inc1.devtunnels.ms/ I'm trying to find which section is overflowing, tried inpUsing Vite with SCSSSo i was advised to try scss with vite instead of just using node as i was getting errors. What i dAbsolute position with gridI need help to position a text and image inside a grid item which size its 2fr but trying to positiSVGs <use> and not...Hi guys I really would aprecciate come help here. In this HMTL are two ways of using svgs but one ofHandling inner text when element is transform: scale()'d, how to make not blurrier when scaled up?GH:https://github.com/nnall/hm-frontend-Nick.git I have an element in my react return, several realReact + Tailwindcss users? Help with some examples please!I'm trying to learn this damn thing, unfortunately every job here uses it and I've done nothing but Navbar helpi cant get the navbar to go end to end on the pageVS code control panelhey guys does anyone know how can i add source control button in my vs code left panel i tried everyAdding code blocks to websitesI see some websites and blogs like this have these really nicely styled code blocks with syntax highFlexbox column swap without media or container querie.I watched this video by KP (https://www.youtube.com/watch?v=LEkFckg7sfw), and got the flex solution