CSS Controls the look and partial function of an element. Useful during [[Web Development]] in order to control the look of an [[HTML#Element|HTML]] element. ## Scroll Snapping Scroll snapping is when the browser engine snaps a scrolling context based on the rules dictated by the elements and scroll container. ## Grid * Grid gap determines the minimum size of a grid column * I've noticed that nested grids are very un-performant. Try to use flex for deeply nested hierarchies. * You can have overlapping items by putting multiple items in the same column/row pair ### Subgrid * Useful for aligning elements in other elements * Gap is still obeyed in grid * Adjust auto-flow as needed! # Resources https://getcssscan.com/css-box-shadow-examples -- one click box shadows https://scroll-driven-animations.style/ --- # References 1. https://vxtwitter.com/wesbos/status/1734608366918570148 2. https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_scroll_snap