Почему display: inline-block для дочерних div может давать пробел между ними, а display: flex у родителя — нет? Как влияет перенос строки в HTML-разметке и её минификация?

Inline-block участвует в строчном форматировании, поэтому пробелы и переносы между тегами могут отображаться как текстовый промежуток.

Flex раскладывает элементы как flex items, и обычный межтеговый whitespace такого зазора не создаёт. Минификация иногда убирает текстовые пробелы и меняет inline-block layout, поэтому лучше задавать нужные интервалы через gap или margin, не полагаясь на исходное форматирование HTML.