Суть на практике
float вынимает элемент из обычного потока и прижимает его к левому/правому краю контейнера; текст и inline-контент обтекают его.
img.left {
float: left;
margin: 0 1rem 0.5rem 0;
}
Родитель без clearfix может «схлопнуться» по высоте. Сегодня для раскладок предпочитают Flex/Grid; float остаётся для обтекания текстом и легаси.
Значения: left, right, none, inline-start/inline-end.
Итог
Float — обтекание, не полноценный grid-инструмент XXI века.
