Какие знаешь системы раскладки HTML в CSS

Flexbox и Grid — две основные современные системы раскладки.

Flexbox — одномерная система (работает с рядами или колонками). Идеален для выравнивания элементов внутри контейнера.

.container {
  display: flex;
  justify-content: center;
  align-items: center;
}

Grid — двумерная система (работает с рядами и колонками одновременно). Позволяет создавать сложные макеты.

.container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
}

Также есть Float (устаревший, но иногда встречается) и Positioning (absolute, relative и др.) для специфичных случаев.