CodePen Embed - Tailwind CSS v3 Aspect Ratio

<script src="https://cdn.tailwindcss.com"></script>

<div class="flex w-screen h-screen place-items-center justify-evenly">
  <div class="max-w-lg">
    <img class="w-full aspect-square" src="https://images.pexels.com/photos/3470481/pexels-photo-3470481.jpeg?auto=compress&cs=tinysrgb&w=760" />
  </div>
  <div class="max-w-lg">
    <img class="w-full aspect-video" src="https://images.pexels.com/photos/3470481/pexels-photo-3470481.jpeg?auto=compress&cs=tinysrgb&w=760" />
  </div>
</div>

Run Pen

This Pen is owned by Felix Icaza on CodePen.

See more by @felixicaza on CodePen

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.