Estou tentando criar um site e usá-lo tailwindcss
como parte do frontend. (Estou usando imagens de banco de imagens neste post)
E como você pode ver acima, não consigo alinhar as duas imagens, (a terceira imagem é empurrada para baixo porque a segunda está no lugar) está perfeitamente bem antes de adicionar incline-block
para ter Text
as imagens na posição correta .
aqui está o código para esta seção:
<div class="relative ml-14 mt-2 inline-block">
<img src="stockimage" alt="" class="float-left transition transform rounded-lg">
<div class="absolute bottom-0 left-0 px-8 py-4 transition transform">
<h1 class="text-white font-bold text-xl transition-transform transform hover:scale-105">Something</h1>
</div>
</div>
<div class="relative mr-14 mt-2 inline-block">
<img src="stockimage" alt="" class="float-right transition transform rounded-lg">
<div class="absolute bottom-0 left-0 px-8 py-4 transition transform">
<h1 class="text-white font-bold text-xl transition-transform transform hover:scale-105">Something</h1>
</div>
</div>
<div class="relative mr-14 mt-2 inline-block">
<img src="stockimage" alt="" class="float-right transition transform rounded-lg">
<div class="absolute bottom-0 left-0 px-8 py-4 transition transform">
<h1 class="text-white font-bold text-xl transition-transform transform hover:scale-105">Something</h1>
</div>
</div>
Eu tentei alguns métodos alternativos, mas não consegui nenhum resultado com eles. Qualquer ajuda seria muito apreciada.