В чем разница между flexbox и float

Flexbox — современная модель верстки, созданная для удобного выравнивания и распределения элементов внутри контейнера. Она позволяет управлять направлением, порядком, размерами и выравниванием элементов с помощью свойств display: flex, justify-content, align-items и других.

Float — устаревший способ позиционирования, изначально предназначенный для обтекания текстом изображений (float: left/right). Он не предназначен для сложных макетов, требует очистки (clearfix) и может вызывать проблемы с высотой родителя.

Пример Flexbox:

.container {
  display: flex;
  justify-content: space-between;
}

Пример Float:

.box {
  float: left;
  width: 50%;
}

Flexbox проще, мощнее и предпочтителен для современных макетов, а float лучше использовать только для специфических задач (например, обтекание текста).