Vi gick bland annat igenom
- lösningsförslag flexbox-övningen med Doge Kingdom
- CSS child selector
- media queries
Doge Kingdom
HTML och CSS för den varianten av sajten vi skapade i morse.
HTML och CSS för den varianten av sajten jag hade förberett.
CSS child selector
För att skriva CSS-regler som bara gäller för direkta barn, inte barnbarn eller barnbarns barn.
Läs mer om CSS Child Selector på MDN: https://developer.mozilla.org/en-US/docs/Web/CSS/Child_combinator
Workshop
Se om ni kan få era artiklar under ”All the Dogs” på er Doge Kingdom-sajt att ändra hur de är layout:ade efter hand som webbläsarens bredd minskar.
Förslag:
- ≥960px = 4 per rad
- ≥768px = 3 per rad
- ≥576px = 2 per rad
- <576px = 1 per rad
Kan ni även formattera om ”Contact” så att de två kolumnerna lägger sig ovanpå varandra om det är mindre än 576px i tillgänglig bredd?
Kika även på https://internetingishard.com/html-and-css/responsive-design/ om Responsive Design, Media Queries och Mobile-First.
Till nästa lektion
Vila 😅. Ses imorgon 😛.
