title: Changing card size in CSS
body: <p>I have a bunch of cards on my page, i am having a hard time getting them to the same size. I am using Materialize CSS.<a href="https://i.stack.imgur.com/dg7yK.jpg" rel="nofollow noreferrer">This is how they are now</a>
  How do i get them to the same size? </p>
  
  <pre><code>``&lt;div class="valign-wrapper"&gt;
        &lt;div class="container"&gt;
          &lt;div class="row"&gt;
            &lt;div class="col s12 m3"&gt;
              &lt;div class="card"&gt;
                &lt;div class="card-image"&gt;
                  &lt;img src="img/4.jpg" class="responsive-img"&gt;
                &lt;/div&gt;
                &lt;div class="card-content"&gt;
                  &lt;p&gt;I am a very simple card. I am good at containing small bits of information. I am convenient because I
                    require little markup to use effectively.&lt;/p&gt;
                &lt;/div&gt;
                &lt;div class="card-action"&gt;
                  &lt;a href="#"&gt;This is a link&lt;/a&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="col s12 m3"&gt;
              &lt;div class="card"&gt;
                &lt;div class="card-image"&gt;
                  &lt;img src="img/4.jpg" class="responsive-img"&gt;
                &lt;/div&gt;
                &lt;div class="card-content"&gt;
                  &lt;p&gt;I am a very simple card. I am good at containing small bits of information. I am convenient because I
                    require little markup to use effectively.&lt;/p&gt;
                &lt;/div&gt;
                &lt;div class="card-action"&gt;
                  &lt;a href="#"&gt;This is a link&lt;/a&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="col s12 m3"&gt;
              &lt;div class="card"&gt;
                &lt;div class="card-image"&gt;
                  &lt;img src="img/4.jpg" class="responsive-img"&gt;
                &lt;/div&gt;
                &lt;div class="card-content"&gt;
                  &lt;p&gt;I am a very simple card. I am good at containing small bits of information. I am convenient because I
                    require little markup to use effectively.&lt;/p&gt;
                &lt;/div&gt;
                &lt;div class="card-action"&gt;
                  &lt;a href="#"&gt;This is a link&lt;/a&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
            &lt;div class="col s12 m3"&gt;
              &lt;div class="card"&gt;
                &lt;div class="card-image"&gt;
                  &lt;img src="img/blogo.jpg" class="responsive-img"&gt;
                  &lt;span class="card-title black-text"&gt;Card Title&lt;/span&gt;
                &lt;/div&gt;
                &lt;div class="card-content"&gt;
                  &lt;p&gt;I am a very simple card. I am good at containing small bits of information. I am convenient because I
                    require little markup to use effectively.&lt;/p&gt;
                &lt;/div&gt;
                &lt;div class="card-action"&gt;
                  &lt;a href="#"&gt;This is a link&lt;/a&gt;
                &lt;/div&gt;
              &lt;/div&gt;
            &lt;/div&gt;
          &lt;/div&gt;
        &lt;/div&gt;
      &lt;/div&gt; ``
  </code></pre>
  
  <p>This is what my main index.html file looks like? And how would i fix the issue for the future. Thank You</p>