title: How can i get the pinterest-like layout with tailwind and react?
body: <p>i'm trying to get a pinterest-like layout but i cannot achieve it,</p>
  <p><a href="https://i.stack.imgur.com/oIW8m.jpg" rel="nofollow noreferrer">Here is what i want :</a></p>
  <p><a href="https://i.stack.imgur.com/9nC3d.png" rel="nofollow noreferrer">and here is what i get :</a></p>
  <p>Here is the div of the card :</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;div className='border-[1px] border-blanc rounded-[18px] w-[25rem] h-fit justify-between hover:bg-gray-400/5 cursor-pointer '&gt;</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>and here is the div that map all the card :</p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>&lt;div className='pt-[5rem] w-[90rem] ml-[2rem] grid grid-cols-3 '&gt;
              {datas.map((e) =&gt; (
                      
                  &lt;Card posterName={e.posterName} posterUsername={e.posterUsername} content={e.content} likes=           {e.likes} dislikes={e.dislikes} commentsCount={e.commentsCount} key={e.id} id={e.id} repostCount={e.repostCount} image={e.image} /&gt;
                      
                  ))}
  &lt;/div&gt;</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"&gt;&lt;/script&gt;
  &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"&gt;&lt;/script&gt;</code></pre>
  </div>
  </div>
  </p>
  <p>i tried flex-wrap, i tried grid but it doesn't work, where is my error please ?</p>