Работа с адаптивностью

Здравствуйте, я новичок в веб-программировании и у меня возникла проблема при работе с медиа-запросами. При «сдвигании» и «раздвигании» окна браузера все отлично работает, но как только я перехожу в отладчик Chrome и выбираю как бы просмотр в режиме телефона, планшета и.т.д. то код не отрабатывает и я не понимаю почему?(
Помогите пожалуйста. Может я как то не так записала медиа-запрос? Или проблема в том что я работаю с препроцессором(Sass)?
P.S. еще у меня не получилось подключить файл через @import и я использую link
Элли
Элли
09 сентября 2016, 11:01
modx.pro
1 239
0

Комментарии: 7

PG
PG
10 сентября 2016, 02:09
0
добавьте в это перед закрывающим тегом head в html 
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1">
    Элли
    Элли
    12 сентября 2016, 08:11
    0
    Спасибо, попробую)
    Алексей
    Алексей
    10 сентября 2016, 07:32
    0
    Добрый день!
    А что не получилось подключить через @import? На втором снимке у вас подключен шрифт Open Sans, но только латиница. Вот эту запись необходимо добавить в файл CSS "@import 'https://fonts.googleapis.com/css?family=Open+Sans:300,400&subset=cyrillic';". И прописать стиль «font-family: 'Open Sans', sans-serif;». Все должно работать.
      Элли
      Элли
      12 сентября 2016, 08:12
      0
      Шрифты у меня отлично работают) Не работают css файлы подключенные через @import
        Stan Ezersky
        Stan Ezersky
        12 сентября 2016, 11:16
        0
        Не подключайте через импорт, при минификации эти файлы будут потеряны или минификатор их не отработает
          Алексей
          Алексей
          12 сентября 2016, 11:44
          0
          Добрый день. Вот мой вызов, все работает:
          [[MinifyX?
	&minifyCss=`1`
	&registerCss=`1`
	&cssSources=`
		[[++assets_url]]components/themebootstrap/css/bootstrap.css,
		[[++assets_url]]components/themebootstrap/css/add.css
	`
	&minifyJs=`1`
	&registerJs=`1`
	&jsSources=`
		[[++assets_url]]components/themebootstrap/js/bootstrap.min.js,
		[[++assets_url]]components/themebootstrap/js/add.js
	`
]]
          Вызов в bootstrap.css:
          @import 'https://fonts.googleapis.com/css?family=Cuprum|Roboto+Condensed&subset=cyrillic,cyrillic-ext';
          А вот мини файл:

          Все работает.
          Алексей
          Алексей
          12 сентября 2016, 11:55
          0
          Просто подключите их через MinifyX, в той последовательности в какой они нужны.
        Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
        7