Junior
What CSS layouts do you know?
sobes.tech AI
Answer from AI
- Flexbox: A one-dimensional system for aligning items within a container along a single axis (horizontal or vertical). Ideal for small components and aligning elements inside a block.
- Grid Layout: A two-dimensional system for creating complex grids on a page. Allows easy management of element placement both in rows and columns. Perfect for the main layout of a page.
- Block Layout: The default standard block behavior of elements. Elements occupy the full available width and are stacked vertically.
- Inline Layout: Elements are arranged in a single line, occupying width equal to their content.
- Positioned Layout: Allows positioning elements relative to their normal position, parent element, or viewport using
position(static, relative, absolute, fixed, sticky) and propertiestop,right,bottom,left. - Table Layout: Recreates the behavior of table elements (
display: table,display: table-cell, etc.). Used less frequently than Grid or Flexbox for creating table structures. - Multi-column Layout: Allows splitting the content of a block container into multiple columns, like in a newspaper. Managed with properties
column-countandcolumn-width.