Could someone assist me with my HTML code?
I am struggling to figure out why my two cards are not displaying side by side on my webpage. I would also like them to be able to resize based on the size of the page.
In the past, I was able to achieve this with different types of cards from Materialize.
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/materialize/0.97.8/css/materialize.min.css" />
<div class="row">
<div class="card blue-grey darken-1">
<div class="card-image waves-effect waves-block waves-light">
<img class="activator" src="/Users/sarahgarson/Downloads/WhatsApp Image 2024-03-15 at 18.03.28 (1).jpeg" />
</div>
<div class="card-content">
<span class="card-title activator white-text">Full-Stack Development Course<i class="material-icons right"
>more_vert</i
></span
>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4"
>A little bit about my Full-Stack Development Course:<i
class="material-icons right"
>close</i
></span
>
<p>
(just to make the code shorter here...)
</p>
<p>
(just to make the code shorter here...)
</p>
</div>
</div>
<div class="card blue-grey darken-1">
<div class="card-image waves-effect waves-block waves-light">
<img
class="activator"
src="/Users/sarahgarson/Downloads/WhatsApp Image 2024-03-15 at 23.03.21.jpeg"
/>
</div>
<div class="card-content">
<span class="card-title activator white-text"
>Mechanical Engineering Course<i class="material-icons right"
>more_vert</i
></span
>
</div>
<div class="card-reveal">
<span class="card-title grey-text text-darken-4"
>A little bit about my Mechanical Engineering Course:<i
class="material-icons right"
>close</i
></span
>
<p>
(just to make the code shorter here...)
</p>
<p>
(just to make the code shorter here...)
</p>
</div>
</div>
</div>