Наверняка.
Но вы не приложили песочницу, поэтому неизвестно как именно вы решаете задачу.
В любом случае есть единицы измерения относительно вьюпорта.
выглядит не очень
Тут нужно определиться, вопрос по дизайну к дизайнерам или у вас не получается с версткой. Это капитально разные теги у вопроса и, возможно, разные отвечающие.
Windyay, Поддерживаю Сергея про безразмерный множитель.
Посмотрите, как ведет себя line-height в процентах для дочерних элементов (третий блок) - как был 20px, так и остался => выглядит плохо и придется переопределять. С безразмерным коэффициентом совсем ужаса не случится.
Открываете инструменты разработчика, вкладку Console.
Браузер напишет, что не нашел картинки и где их искал.
Нужно сравнить те пути по которым ищет браузер и те, по которым реально лежат файлы.
Скорректировать.
Перед тем как исправлять, чтобы не накосячить ещё больше, можно прочитать: Абсолютные и относительные ссылки
Markiv07, если к вопросу прикладывать кроме стилей ещё и разметку, то будет проще жить. И вы ответ быстрее получите и нам не нужно играть в угадайку.
А ещё лучше сразу кроме кода, делать песочницу на codepen.io и прикреплять к вопросу.
Ладно, если ваши элементики это div, то, во-первых, ему флекс вообще даром не нужен, во-вторых, он сам лишний.
Теперь со стилями: у меню ширина 50%. Не очень видно от чего, но предположим, что у родителя ширина не фиксированная. Значит, при уменьшении экрана меню становится уже. И в него перестают помещаться div'ы, у которых фикс ширина 340px по 3 в ряд.
Вывод: ответ примерно тот же самый: если вы хотите, чтобы помещалось по 3 элемента в ряду без отступов между ними, их ширина должна быть 33.33%
Альтернатива - гриды в три столбца по 1fr каждый. Совсем ничего считать не нужно.
Задайте нужный размер во flex-basis или width. Типа 33.33% или просто в px.
Сейчас вы творите что-то странное. Родитель фиксированной в px ширины.
Вам нужно поставить дочерние по три в ряд.
Зачем вы пишете flex-basis: 100%;, зачем вам flex-grow и flex-shrink отличные от 0.
Зачем width: inherit;? Вам же не нужно 340px для дочерних.
zeaovede, дело в том, что нет гарантии, что все браузеры будут поступать одинаково. Я к этому.
Поэтому лучше указывать именно ту жирность, которую вы собираетесь использовать. Также лучше указывать запасной подходящий безопасный шрифт или хотя бы семейство. Чтобы случайно не получить засечки как замену шрифту без засечек.
zeaovede, осталось для ясности попробовать вернуть local, указав верную жирность.
Потом local снова убрать, чтобы обезопасить себя от того, что у пользователя может стоять шрифт какой угодно кривизны.
Пожалуй добавлю еще мысль: если хочется избавиться от гуглежки и самостоятельных раскопок информации, если такая деятельность действительно доставляет страдания или неудобства, то пересмотрите свои желания уже сейчас и хорошенько подумайте, а стоит ли продолжать расходовать время на айти.
Это не с целью вас обидеть или задеть.
Серьезно. Очень много рабочего, да и свободного времени тратится именно на это. (Да просто потому что обычно это в кайф и интересно :) )
Думаю, что пока обновляете, найдете в чем разница.