quikcue/taawunu-site
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Use minmax(0,1fr) for story-photo sub-grid img row — definite height resolves % correctly

Browse Source
This commit is contained in:
Omair Saleh
2026-03-09 02:56:37 +08:00
parent f3dc0eb7ab
commit 3cfc697d17
1 changed files with 3 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
html/css/style.css
+3 -3
View File
@@ -458,17 +458,17 @@ p { margin-bottom: 16px; max-width: 720px; }
/* story-photo is a grid-within-grid: rows = 1fr (image) + auto (caption) */ /* story-photo is a grid-within-grid: rows = 1fr (image) + auto (caption) */
.story-photo { .story-photo {
display: grid; display: grid;
grid-template-rows: 1fr auto; grid-template-rows: minmax(0, 1fr) auto;
overflow: hidden; overflow: hidden;
position: relative; position: relative;
} }
.story-photo img { .story-photo img {
width: 100%; width: 100%;
min-height: 0; height: 100%;
object-fit: cover; object-fit: cover;
transition: transform 0.6s; transition: transform 0.6s;
display: block; display: block;
/* No height: 100% — avoids circular % resolution in sub-grid 1fr row */ /* minmax(0,1fr) row = definite height → height:100% resolves correctly */
} }
.story-block:hover .story-photo img { .story-block:hover .story-photo img {
transform: scale(1.03); transform: scale(1.03);