From: Ardis Lu <ardisglu@gmail.com>
Date: Tue, 23 Nov 2021 07:14:30 +0000 (-0800)
Subject: Fix regression on grid-template-columns
X-Git-Url: https://git.ardis.lu/?a=commitdiff_plain;h=918485b72d55d262c7214fbac91b54fd7492a7a8;p=ardislu.dev

Fix regression on grid-template-columns

The "simplification" causes overflow when the screen width is smaller than card-container.  Putting the inner min() inside minmax() ensures that card-container will never be larger than the screen width.
---

diff --git a/style.css b/style.css
index ba9e8ce..6ebc8e4 100644
--- a/style.css
+++ b/style.css
@@ -39,7 +39,7 @@ kbd {
 
 .card-container {
   display: grid;
-  grid-template-columns: repeat(auto-fit, minmax(360px, 1fr));
+  grid-template-columns: repeat(auto-fit, minmax(min(360px, 100%), 1fr));
   grid-gap: 1rem;
   margin-inline: auto;
   margin-block-end: 1rem;