我的工作与顺风css设计卡片，我想左这个按钮的位置

Question

我使用顺风css来设计卡片，我想要这个按钮的左边位置阅读更多的内部div卡我使用顺风css来设计卡片我想要这个按钮的左边位置阅读更多内部div卡

  <div class=" overflow-hidden shadow-lg  px-6 py-4  bg-white   rounded border-2 border-gray-400">
    <img class="w-full lazy rounded"  src="./images/1.jpg" >
    <div class="py-2 mt-4">
      <div class="font-black text-xl mb-2">Title</div>
      <div class="space-x-3">
        <div class="inline-block  pl-4 lg:pr-4 text-base     text-gray-400">Gendre : male</div>
        <div class="inline-block  lg:pr-4 text-base    text-gray-400">Height : 150</div>
        <div class="inline-block  lg:pr-4 text-base  text-gray-400">Mass : 150</div>
      </div>
    </div>
    <div class="space-x-1  pl-4 pt-2">   
    
       <img class="inline-block   "  src="./images/heart.png"  >
       <div class="inline-block   text-base     text-gray-400">12 K</div>  
       <img class="inline-block   "  src="./images/share 1.png"  >   
       <div class="inline-block   text-base     text-gray-400">160</div>  
      
   </div>
   <a [![picture card][1]][1]
   href="/#"
   class="inline-block relative    mr-0 mt-2 px-3  py-2 rounded text-white hover:bg-pink-400 hover:text-white bg-pink-600"
   >
   <span>Read more</span>
 </a> 
    
  </div>

Answer 1

您的输出中似乎出现了什么问题？我复制粘贴了你的代码，它工作得很好。检查它，here。如果你想真正控制它在左边的位置，把它包装在div里面，像this一样使用.flex .justify-start。