LAYOUT
- Layout is the way text, images and other content is polace and arranged on a webpage.
- Layout gives the page a visual structure, into which we place our content.
- Building a layout: arranging page elements into a visual structure, instead of simply having them placed one after another (normal flow).
COMPONENT LAYOUT
- Components are smaller things arranged in a block, then is brought into the bigger layout.
- Positioning between a container and its components.
- Positioning elements belonging to a component.
- Positioning sibling components.
1. Float Layouts – The old way of building layouts of all sizes, using the float CSS property. Still used, but getting outdated fast.
2. Flexbox – A modern way of laying out elements in a 1-dimensional row without using floats. Perfect for simpler component layouts.
3. CSS GRID – A modern way for laying out elements in a fully-fledged 2-dimensional grid. Perfect for page layouts and complex components.