|
|
@@ -124,4 +124,10 @@
|
|
|
* Attention: Screen readers and browsers only use this for placement. Selecting and screen reading works on the HTML source.
|
|
|
|
|
|
# 19 - Nesting Grid Image Gallery
|
|
|
-*
|
|
|
+* Grids can be nested
|
|
|
+* A grid item can also be a grid container for other items
|
|
|
+* Overlays can be realized with fixed positioned elements that switch between `display: none` and `display: grid`
|
|
|
+* Within the overlay, grid can help to position the content with `justify-items` and `align-items`
|
|
|
+* Use `grid-auto-flow: dense` to fill unused space in the grid.
|
|
|
+* CSS `object-fit: fill | contain | cover | none | scale-down` defines how elements fill up space of their parent.
|
|
|
+* Use `translate` or other properties together with `transistion` for animations.
|
