У меня проблема с попыткой сделать мое портфолио более мобильным. Происходит то, что происходит при начальной загрузке, страница представлена в «увеличенном» состоянии. Я могу уменьшить масштаб и увидеть сайт таким, каким он должен быть. Кажется, что панель навигации занимает нужную ширину, но все элементы ниже значительно шире , и я не могу найти ни одной причины.
Текущий код обновлен до https://codespent.dev для проверки, поэтому я не буду загромождать этот вопрос кодом, я добавлю соответствующий код при устранении неполадок.
Что я пробовал:
Попытка добавления метаданных области просмотра к ограничить масштабирование и установить начальный масштаб .
<meta name="viewport" content="width=device-width; initial-scale=1.0; user-scalabe=0;">
Насколько мне известно, нет статической ширины элементов.
Подтверждено, что сообщил ширина устройства является точным , но элементы все еще имеют ширину.
Выводы:
Холст на диаграммах приводит к тому, что ширина документа не соответствует настройке responsive: true;, которая игнорирует высоту и ширину.
- Исправлено это путем установки
max-width: 250px на canvas, чтобы предотвратить расширение из-за неправильного чтения ширины устройства.
Переполнение строк кода пишущей машинки приводит к увеличению ширины.