Merge pull request #157 from GoCon/improve/job-board

r-kataoka11 · web-flow · commit 8718367c934f · 2025-09-27T11:34:11.000+09:00
💄 Safariでジョブボードの表示が崩れる問題を修正
diff --git a/src/components/JobBoardCard.astro b/src/components/JobBoardCard.astro
@@ -46,9 +46,10 @@ const { src, alt, width, height, link } = Astro.props;
       grid-template-columns: 1fr; /* 1200px以下なら1列 */
       width: unset;
       height: unset;
-      max-width: 1120px;
-      max-height: 560px;
       aspect-ratio: 2 / 1;
+      /* grid内のaspect-ratioを指定するとSafariではうまくサイズ計算できない不具合への対策 */
+      min-width: 0;
+      min-height: 0;
     }
   }
 </style>

Original file line number	Diff line number	Diff line change
`@@ -46,9 +46,10 @@ const { src, alt, width, height, link } = Astro.props;`
`46`	`46`	`grid-template-columns: 1fr; /* 1200px以下なら1列 */`
`47`	`47`	`width: unset;`
`48`	`48`	`height: unset;`
`49`		`- max-width: 1120px;`
`50`		`- max-height: 560px;`
`51`	`49`	`aspect-ratio: 2 / 1;`
	`50`	`+ /* grid内のaspect-ratioを指定するとSafariではうまくサイズ計算できない不具合への対策 */`
	`51`	`+ min-width: 0;`
	`52`	`+ min-height: 0;`
`52`	`53`	`}`
`53`	`54`	`}`
`54`	`55`	`</style>`