How to put my text in a single line in tailwind css?

I want the result to be like this

but this is what i get

with my svelte code:

<div  style="background-image: url('{unsplash?.url}');"  class="bg-black flex items-center justify-center min-h-screen bg-cover"><Authenticate /><!-- here is my div --><div class="block flex absolute bottom-9 left-5 h-16 w-16"><img src={unsplash?.author.avatar} alt={unsplash?.author.username} class="rounded-full" /><p class="inline-block text-blank ml-2">      By <a class="inline-block" target="__blank" href={unsplash?.author.url}>{unsplash?.author.username}</a></p><p class="inline-block text-black">      Find similar pictures on <a class="inline-block" target="__blank" href="http://unsplash.com">Unsplash</a></p></div></div>

i used inline-block, but doesn't work