Игнорируется мета в HTML. Что делать?

Ссылка скопирована
CSS HTML PHP
17 апреля 2026 1 ответ

Игнорируется мета тег на адаптацию. Перепробовал очень много методов ни один не помог. Решение не нашел. Подозреваю, что где-то конфликт, пробовал отключать уже библиотеки - тоже не помогло, думаю, может в css где-нибудь кроется ответ, вот только где?

<meta name="viewport" content="width=device-width, initial-scale=1.0">

<meta name="viewport" content="width=device-width, initial-scale=1.0">

Дополнительно:

Ответ кроется в медиа-запросах.

  • Rise, Никакие не применяются , перепробывал все методы , они просто не встают нет не каких изменений, да и еще к тому же когда растягиваю сайт сайт стоит на месте не адаптируется под размер браузера,
  • Илья Мок, тоесть, судя по тому что ты написал, ты считаешь что как бы вот этого кода хватает, чтобы все было адаптивно? у меня для тебя плохие новости
  • modelair, Этого кода мало но его достаточно чтобы чтобы он хоть что то дал, хоть маленький откликт. Вообще 0 действий не отрабатывает.@modelair,
  • > Игнорируется мета тег на адаптацию.

    Какие ваши доказательства?

  • Илья Мок, в вашем проекте еще должен быть написан вашими ручками не менее объемистый кусочек CSS файла с альтернативными стилями для разных размеров экрана, чем уже имеющиеся подключенные стили, чтобы все работало как надо.
  • Илья Мок,

    Этого кода мало но его достаточно чтобы чтобы он хоть что то дал, хоть маленький откликт.

    Что написано в разметке и в стилях говорящее о перестроении?

    В чем может быть дело:
    - Вообще не тот файл.
    - Где-то есть блок с фиксированной шириной, мешающи перестроению всего остального.
    - Неверно понимаете размер вьюпорта там, где проверяете.
    - Неверно написаны media или другие правила
    - Неверный порядок media и стилей без media.
    - Невалидный код (разметка или стили)
    и т.д.

    Чтобы узнать, что там у вас происходит, сделайте пример с минимальным и достаточным кодом на codepen.io
    (Если что, meta viewport там уже есть, в разметку писать нужно внутренности body)

  • Илья Мок,

    но его достаточно

    Чел, просто написать мета тег недостаточно, это вообще ничего не даст.

  • Lynn «Кофеман», 
    @media (max-width: 1024px) {    	.container {    		width: auto;    	}     	.List_product {    		flex-wrap: wrap;    	}     	.product {    		margin-right: 25px;    	}    }

    @media (max-width: 1024px) { .container { width: auto; } .List_product { flex-wrap: wrap; } .product { margin-right: 25px; } }

    это мои css написал по минимуму и тоже думаю что где то блок что вообще ничего не отрабатывает, видел людей у них сразу все начало отрабатывать после маленького кода.

  • Rise, он же должен хоть какую нибудь реакцию дать. Или что то обновилось и уже этого не достатточно вот что еще в цсс прописано чтобы посмотреть 
    @media (max-width: 1024px) {    	.container {    		width: auto;    	}     	.List_product {    		flex-wrap: wrap;    	}     	.product {    		margin-right: 25px;    	}    }

    @media (max-width: 1024px) { .container { width: auto; } .List_product { flex-wrap: wrap; } .product { margin-right: 25px; } }

  • alexalexes, 
    @media (max-width: 1024px) {    	.container {    		width: auto;    	}     	.List_product {    		flex-wrap: wrap;    	}     	.product {    		margin-right: 25px;    	}    }

    @media (max-width: 1024px) { .container { width: auto; } .List_product { flex-wrap: wrap; } .product { margin-right: 25px; } }

  • Илья Мок, этих стилей тоже недостаточно.
    Нужно видеть где и как написаны стили для другого размера.
    Например, вы написали общие стили после media, а не наоборот.
  • Ankhena, это два моих блока универсальных стилей
    Контейнер отвечает за разметку всей страницы.
    Продукт отвечает за вложение на странице картинок иконок и т.п. , а тресте тоже универсальный стиль
  • Илья Мок, я рада. Перечитайте, пожалуйста, что я написала и что нужно показать, чтобы стало понятно, что вы пишете не так. И сделайте это, если действительно хотите получить ответ на вопрос.
  • Ankhena, спасибо
  • Покажите весь <head> 
  • &lt;head&gt; 	&lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt;  	&lt;title&gt;Chic Mok&lt;/title&gt;  	&lt;link href="fontawesome/css/all.css" rel="stylesheet"&gt; 	&lt;link href="styles/bootstrap/css/bootstrap.min.css" rel="stylesheet"&gt; 	&lt;link rel="stylesheet" href="styles/style.css"&gt; &lt;/head&gt;

    &lt;head&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt; &lt;title&gt;Chic Mok&lt;/title&gt; &lt;link href="fontawesome/css/all.css" rel="stylesheet"&gt; &lt;link href="styles/bootstrap/css/bootstrap.min.css" rel="stylesheet"&gt; &lt;link rel="stylesheet" href="styles/style.css"&gt; &lt;/head&gt;

  • Илья Мок, почему не используете разметку от бутстрапа?
    https://getbootstrap.com/docs/5.3/getting-started/...
    Это скорее всего не критично, но почему бы не следовать рекомендации?
  • maksam07, Согласен

    Я думаю что одна из вероятных причин - это наличие других мета-тегов, которые могут переопределять его. Также возможно, что какие-то другие стили или скрипты в проекте могут переопределять параметры мета-тега viewport.

  • maksam07, пробовал тоже не работает
  • Sergey, тоже думаю что где-то что то не то , а вот где не знаю
  • Илья Мок, удалите все лишнее в коде, начните со стандартного html кода от бустрапа и проверьте, если все работает, то по кускам возвращайте свой прошлый код, вероятнее проблема кроется в нем. Я буквально вчера тоже так на один свой косяк напоролся по невнимательности. Думал, что у фреймворка какой-то баг, а это я сам его создал и не заметил
  • maksam07, Спасибо большое хорошее решение так и сделаю.
  • Илья Мок, если решение поможет - скажите, опубликую его как решение, чтобы вы смогли отметить

    • Нашел решение и пришлось немного покопаться проблема блока была в css
    я поставил сам блок а тоесть

    .conteiner { width: 1200px; &lt;--- вот он и был блок margin: 0 auto; }

    .conteiner { width: 1200px; &lt;--- вот он и был блок margin: 0 auto; }

    переписал его так и все заработало 

    .conteiner {    	display: inline-block;    	padding: 15px 30px 15px 30px;    	width: 100%;    }

    .conteiner { display: inline-block; padding: 15px 30px 15px 30px; width: 100%; }

    Спасибо большое всем за советы, очень полезно было!

    Нужно решить такую задачу?

    Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.

    Заказать помощь
    Лучший ответ
    1
    Никита Орлов Ответ

    Для подсветки синтаксиса кода всех языков программирования на сайте, вы можете воспользоваться тегом

    . Просто оберните свой код в этот тег и добавьте язык программирования после слова "lang=". Например, если у вас есть PHP код, вы можете написать:
 
<pre lang="php">

    . Просто оберните свой код в этот тег и добавьте язык программирования после слова "lang=". Например, если у вас есть PHP код, вы можете написать: <pre lang="php">

    Этот код будет отображаться с подсветкой синтаксиса на вашем сайте. Помните, что вы можете использовать этот тег для любого языка программирования, просто замените "php" на нужное вам название языка.

    Если у вас возникли проблемы с использованием тега 

    , пожалуйста, уточните свой вопрос или добавьте больше подробностей, чтобы мы могли помочь вам решить проблему.
    Другие ответы (0)

    Пока нет других ответов. Будьте первым, кто поможет автору.

    Ответить на вопрос

    комментарий

    Ваш адрес email не будет опубликован. Обязательные поля помечены *

    Вам также может быть интересно

    VPN Как правильно настроить vless для Android TV? 0 ответов Pyrogram Как правильно зарегистрировать юзер бота в Telegram? 0 ответов печатные-платы Как заставить запускаться программу M3.exe от компании Hanxing AOI в инспекционной машине на Windows 7 Pro? 0 ответов Аккумуляторные батареи Почему при зарядке автостарта слышен писк, где искать причину? 0 ответов