Вопрос опытным верстальщикам насчет свойства float?

Question

[IvanIvanIvanIvanIvan]

https://jsfiddle.net/mx5rcqhg/
Верстаю свой первый сайт. Такой вопрос. У меня на сайте блоки расположены с помощью свойства float:left. Как в этом примере.
Обратил внимание что если увеличить масштаб браузера, то блоки которые не влазят в окно начинают строится друг под другом.
Вопрос в следующем. Это нормально? так и должно быть? Потому что по-увеличивал масштаб на других сайтах, и там ничего никуда не едет, все на своём месте остается

Comments

[Justique]

Лучше почитайте про flexbox

[Eugene Chefranov]

Задавайте размеры в процентах и будет норм

Answer 1

[Anton Filippov]

Да это нормально. И это одна из причин, почему раньше использовали флоаты, перенос контента был удобен для создания перечисляемых элементов или для работы с @media. Это неочевидное поведение, но сейчас в 2к18 есть флексы, на которых всё читаемо и понятно.

Comments

[IvanIvanIvanIvanIvan]

Преподаватель говорил что флексы не надо использовать, потому что они еще плохо работают. В частности в safari

[Anton Filippov]

IvanIvanIvanIvanIvan, преподаватель старой закалки)
Флексы не поддерживаются в ничтожно малом количестве браузеров, которые также не поддерживают другие свойства, например, @media, box-shadow, transition и т. д.

В сафари и новых ие проблемы с флексами могут быть при использовании шортхенда, это когда пишешь flex: и перечисляешь все свойства. Если использовать свойства по отдельности(flex-direction, flex-basis, flex-wrap etc.), всё работает отлично

Уже почти 3 года коммерчески верстаю и использую флексы, пока никто не жаловался)

Answer 2

[Mr Crabbz]

Пройдите бесплатный курс https://htmlacademy.ru/ - у вас сразу отпадёт 99% вопросов.
В частности, раздел про float и его особенности: https://htmlacademy.ru/courses/65

Answer 3

[Василь Бойко]

Вы задаете фикс. ширину блоков в - 150px, задайте их в %, как уже подсказывали