|
|
@@ -0,0 +1,16 @@
|
|
|
+# 02 - Starter Files and Tooling
|
|
|
+* Firefox has good built-in tools to analyze CSS grid
|
|
|
+* Node can help serve HTML files and reload them on change (browser-sync module)
|
|
|
+* Wes Bos' repository: https://github.com/wesbos/css-grid.git
|
|
|
+* Use Emmet for HTML and CSS
|
|
|
+* TODO: Show list of VS code extensions.
|
|
|
+* CSS: use `box-sizing: border-box` as it includes padding and borders
|
|
|
+
|
|
|
+# 03 - Fundamentals
|
|
|
+* Grid organizes page in rectangular grid cells.
|
|
|
+* Implicit and explicit rows/columns
|
|
|
+* Parent container needs to be `display: grid;`
|
|
|
+ * makes direct children grid items
|
|
|
+* `grid-template-columns: (size) (size)...` defines explicit columns
|
|
|
+ * use `auto` to auto size columns to use up rest of the screen width
|
|
|
+* `grid-gap: (size)` separates columns and rows with
|
