Please enable JavaScript.

Coggle requires JavaScript to display documents.

CSS - Coggle Diagram

- - - - grid: генерує блочну систему
      - inline-grid: генерує вбудовану сітку
  - - - 1) flex-start: Елементи вирівнюються по лівій стороні контейнера.
      - 3) flex-end: Елементи вирівнюються по правій стороні контейнера.
      - 2) center: Елементи вирівнюються по центру контейнера.
      - 4) space-between: Елементи відображаються з однаковими відступами між ними.
      - 5) space-around: Елементи відображаються з однаковими відступами навколо них.
      - 6) space-evenly -рівномірно розподіляє простір між елементами
    - - 1) flex-start: Елементи вирівнюються по верхньому краю контейнера.
      - 2) center: Елементи вирівнюються вертикально по центру контейнера.
        
        3) flex-end: Елементи вирівнюються по нижньому краю контейнера.
        
        4) baseline: Елементи відображаються на базовій лінії контейнера.
        
        5) stretch: Елементи розтягуються, щоб заповнити контейнер.
    - - 1)row: елементи розміщуються у напрямку тексту.
      - 2) row-reverse: елементи відображаються в зворотному порядку до напрямку тексту.
      - 3) column: елементи розташовуються зверху вниз.
      - 4) column-reverse: елементи розташовуються зверху вниз в зворотному порядку.
    - - 1) flex – wrap: вказує чи потрібно аби елементи примусово знаходились в одному рядку чи переносились.
      - 2) nowrap: Розміри елементів встановлюються автоматично, щоб вони помістилися в один рядок
      - 3) wrap: Елементи автоматично переносяться на новий рядок.
      - 4) wrap-reverse: Елементи автоматично переносяться на новий рядок, але рядки розташовані в зворотному порядку.
    - - 1) flex-start: Ряди групуються у верхній частині контейнера.
      - 2) flex-end: Ряди групуються в нижній частині контейнера.
      - 3) center: Ряди групуються вертикально по центру контейнера.
      - 4) space-between: Ряди відображаються з однаковими відстанями між ними.
      - 5) space-around: Ряди відображаються з однаковими відстанями навколо них.
      - 6) stretch: Ряди розтягуються, щоб заповнити контейнер рівномірно.