diff --git a/index.html b/index.html index 6c52bfc..9b26eac 100644 --- a/index.html +++ b/index.html @@ -54,9 +54,8 @@ } .grid { - display: grid; - grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); - gap: 1.25rem; + columns: 320px; + column-gap: 1.25rem; max-width: 1400px; margin: 0 auto; } @@ -67,6 +66,8 @@ border-radius: var(--radius); overflow: hidden; transition: border-color 0.2s, transform 0.2s; + break-inside: avoid; + margin-bottom: 1.25rem; } .card:hover { border-color: var(--accent); transform: translateY(-2px); } @@ -180,7 +181,7 @@ @media (max-width: 600px) { body { padding: 1rem; } - .grid { grid-template-columns: 1fr; } + .grid { columns: 1; } }