title: How to size css cards in the right way
body: <p>so this is my 1st project. and i could appreciate help with this. I tried everything but i dont know what i am doing wrong, i will be so thankful if someone know the sollution.
  Can you please help me with this
  i want the cards to stay the same size, all of em the same as the ones with two lignes paragraph how can i do that?<a href="https://i.stack.imgur.com/XAco8.jpg" rel="nofollow noreferrer">see how it looks</a></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-css lang-css prettyprint-override"><code>.card-project{
      background-color: white;
      border: 1px solid white;
      min-height: 14em;
      width: 23em;
      overflow: hidden;
      border-radius: 10px;
      margin: 20px;
      transition: 0.7s ease;
  }
  
  .card-project:hover{
      transform: scale(1.1);
  }
  
  .img-project img{
      width: 100%;
  }
  
  .card-project:hover .img-project{
      opacity: 0.9;
  }
  
  .info-project{
      padding: 1em;
      
  }
  
  .category{
      font-size: 1em;
      color: black;
  }
  
  
  
  .title-project{
      display: flex;
      justify-content: space-between;
      font-weight: 800;
      margin-top: 10px;
      
  }
  .content{
      display: flex;
      flex-direction: row;
      justify-content: center;
      flex-wrap: wrap;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;section class="projects" id="projects"&gt;
              &lt;h2 class="title"&gt;Projects&lt;/h2&gt;
              &lt;div class="content"&gt;
                  &lt;div class="card-project"&gt;
                      &lt;div class="img-project"&gt;
                          &lt;img src="icons/projetcs/ytb1.png"&gt;
                      &lt;/div&gt;
                      &lt;div class="info-project"&gt;
                          &lt;p class="category"&gt;Some Thresh Play&lt;/p&gt;
                          &lt;strong class="title-project"&gt;
                              &lt;span&gt;0SiFo0&lt;/span&gt;
                              &lt;a class="more-details" href="https://www.youtube.com/watch?v=zRDfPBgSiaw&amp;ab_channel=0SiFo0" target="_blank"&gt;
                                  More details
                              &lt;/a&gt;
                          &lt;/strong&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>