The Cascade and CSS Layout

Preperation

• W3Schools Documentation:
  • Read W3Schools Transitions, Box Sizing, Flexbox Section, and Grid Section
• MDN Documentation:
  • Read MDN Introducing the CSS Cascade

In class: Work on Assignment 2

• Use CSS:
  • Add transitions to animate elements
  • Arrange content into sections that can be layed out using Grid and Flex displays

Check Your Understanding

• Can you make a div that remains 200x200 pixels regardless of the amount of text inside it?
• What is the difference between the flex and grid diplay properties?
• How can you transition more than one property at a time, e.g., background-color and color?
• How does a browser deturmine which CSS rule applies when two conflicting rules are defined?