Уменьшите шрифт еще на единичку или переведите его в vw. Шрифты в разных браузерах рендерятся немножко по разному.
Переделайте из таблицы в список и nav.
И обычно на мобильных меню переделывают в кнопку и потом открывают вертикально.
Ширину нужно задавать контейнеру, а не body, чтобы не влипать в такие проблемы.
Как сделать div child шире, чем div parent?
Задать ширину больше 100%.
Если на всю ширину окна, то 100vw.
Но логичнее делать с другой стороны: большой контейнер с шириной 100%. Там где нужны узкие блоки, там внутренний контейнер нужной ширины (фиксированной или резиново-ограниченной, возможно изменяющейся через media) .
Бывают талантливые люди. Но чаще всего верстальщики не очень умеют рисовать (не имею в виду наклепать шаблон), а дизайнеры не умеют и не хотят верстать. Не каждому дизайнеру удается объяснить, что делать с разными пропорциями и ориентацией экранов.
Вопрос: почему не выделяют отдельную специальность - дизайнер-верстальщик?
Кто умеет, тот делает и то и другое.
Личное мнение: дизайнеру нужно иметь представление о верстке, но не глубокое. Дизайнеры-верстальщики очень сильно упрощают макеты, чтобы не заморачиваться с версткой. А тогда дешевле на монстре купить шаблон и перекрасить, чем нанимать дизайнера.
doroshenko_magic, если выбрано показать как на мобильном, то покажет, как на мобильном, если desktop, то как на десктопе.
а что лучше использовать, если верстаешь адаптивно ?
Ничего не лучше, что вам нужно в данный момент проверить, такие настройки и выбирайте. Если нужно посмотреть как сайт будет выглядеть на 4к мониторе, то логично desktop, если на айфонах, то mobile и 2х. Как какая-то из этих проверок может оказаться лучше или хуже? :)
Если кому-то потребуется посмотреть красивый в инспекторе хрома всегда есть кнопочка для наведения красоты. Для редактирования (если кому-то вдруг приспичит редактировать не scss) во вменяемых программах есть команды типа reformat code.
Потому что кроме выбора размера в инспекторе еще есть выбор типа устройства desktop|mobile, но у вас эта настройка выключена. Включите. И изменяйте тип устройства и смотрите за поведением.
Для изменения порядка следования элементов используйте order.
да, нам бы тоже хотелось смотреть ваш код в браузере, сделайте песочницу на jsfiddle или аналоге