Почему не работают media запросы при сжимании окна браузера?

Евгений Холодов: сейчас скину
По ссылке - стили для media ... 480px применились у меня.

Изображения.... В каких случаях вставлять в css через background, а в каких в html через тег img? Как сделать изображение адаптивным?

Alex_87: сделайте codepen конкретно с вашими стилями, или сайт покажите, так не очень понятно, что именно не работает и почему)

display: block; - стандартное поведение, его необязательно писать.
При адаптиве фиксировать размеры крайне нежелательно. Этот ответ - рабочий, задумка в том что картинка в ширину такая же, как родительский элемент, а высота подстраивается в зависимости от размеров изображения. Можно поставить не max-width, а width и посмотреть, что будет (но с max способ универсальнее). На всякий случай скажу - этот способ для тэга , не для фона

Передача data атрибута ссылкой для изменения класса на след. странице?

Delerium: ключевое слово "на сервере" . У вас есть серверная часть или вы только фронт делаете?

На клиенте есть вариант только записывать дата-атрибут выбранной ссылки в куки, например. А при загрузке страницы читать из куков. (про куки и работу с ними надо гуглить)

Изображения.... В каких случаях вставлять в css через background, а в каких в html через тег img? Как сделать изображение адаптивным?

Alex_87: про фон - background-image . Цвет-то чего адаптировать?)) background-size работает с фоном блока, тэг img - отдельный блок, это не фон.

Статью одну не назову, но Гугл тонну ответов на кидает на запрос "адаптивность картинок css"

По какой причине, предположительно после добавления кодов онлайн консультанта, перестали работать элементы на JS?

Евгений Холодов: можно смело удалять слово touchstart рядом с click, я думаю

Замыкания в javascript, почему не работает?

Алексей Нагаев: вообще-то Владимир абсолютно прав. Замыканий тут нет, всё дело в передаче параметров

Где ошибка в таске?

drtvader: а где оно, собственно? В config.less.src ? Покажите тогда)

Почему элемент в консоле неопределён?

Alex_87: а, так на window.onload ещё эту функцию повесить надо, или на что-нибудь подобное

Что означает эта запись с двумя !!?

Владислав: почему так надо? - я думал, это про синтаксис, ответил.
Зачем? - Да фиг тебя знает) Я использую вместе с indexOf обычно, чтобы получать false вместо -1(true), если искомого элемента нет в массиве

Ошибка в 44 43 строке!?

Виталий: я убирал import-ы, когда копировал себе

Что означает эта запись с двумя !!?

Владислав: символы "!!" - приведение к логическому типу. Согласно синтаксису, как и "!" они ставятся перед приводимым значением.

Ошибка в 44 43 строке!?

Виталий: это рабочий код

Ошибка в 44 43 строке!?

body
  font-size: 16px
    min-width: 320px  //это для мобильных устройств
    position: relative
    line-height: 1.5
    font-family: "RobotoRegular", sans-serif
    overflow-x: hidden
    color: #111

.hidden
  display: none

a
  outline: none!important

strong, b
  font-family: "RobotoBold", sans-serif
  font-weight: normal

h1, h2, h3, h4, h5, h6, .button
  font-family: "RobotoCondensedBold", sans-serif
  font-weight: normal
  text-transform: uppercase

.top-line
  background-color: $main-color
  text-align: center
  a
    color: #fff
  ul, li
    list-style-type: none
    padding: 0
    margin: 0

  .sf-menu
    margin: 0 auto -6px
    float: none
    display: inline-block
    font-family: "RobotoCondensedRegular", sans-serif
    font-size: 15px
    background-color: $main-color
    a
      border-bottom: lighten($main-color, 5%) 1px solid
      border-left: lighten($main-color, 5%) 1px solid
      border-top: none
      >li
        border-bottom: lighten($main-color, 5%) 1px solid
        border-color: transparent
        >a //тут был лишний отступ
          color: #fff
          border: none
          padding: 25px 28px 25px
          .fa
            font-size: 12px
              margin-left: 2px
        &:hover
          background-color: darken($main-color, 4%)
          >a
            color: $accent-color
          ul
            li
              background-color: #main-color
              text-align: left
              &:hover
                >a
                  color: $accent-color
              a
                padding: 10px 20px
                  color: #fff

Ошибка в 44 43 строке!?

Виталий: вру, сек, нашёл

Ошибка в 44 43 строке!?

Виталий:

a
border-bottom: lighten($main-color, 5%) 1px solid
border-left: lighten($main-color, 5%) 1px solid
border-top: none
>li
border-bottom: lighten($main-color, 5%) 1px solid
border-color: transparent
>a

Отступов нехватает перед >li

Ошибка в 44 43 строке!?

Виталий: Вот что показывает компилятор в WebStorm

Что означает эта запись с двумя !!?

Владислав: конечно, потому что надо !!document.body в таком случае. Это приведение к логическому типу.

Медиа запросы. CSS. Не работает элемент. Как исправить?

Антон Вертов: скорее всего условия ложные. Убирайте какие-то из них, проверяйте

Почему отрицательный left + положительный margin в сумме ведут себя нелогично и неадекватно?

Алексей Николаев: я просто посоветую старый метод центрирования, на всякий случай. Работает при любых размерах.

position: absolute; // relative / fixed тоже
left: 50%;
top: 50%;
transform: translate(-50%,-50%);

Соответственно, чтобы выровнять по горизонтали нужно убрать top и сделать transform: translateX(-50%);

Ошибка в gulp. Как пофиксить?

Александр Горкин: отступы просто не скопировались?). То есть так примерно должно быть (Тостер не любит табы, поставил пробелы) :

@import bourbon
@import fonts.sass
@import vars.sass

body
    font-size: 16px
    min-width: 320px
    position: relative
    line-height: 1.6
    font-family: arial, sans-serif
    overflow-x: hidden

.hidden
    display: none

.main-head
    background-image: url(img/bg_top.jpg)
    background-size: cover
    background-position: top center
    height: 100vh	

.mnu-line 
    padding-top: 48px

.logo 
    display: block
    width: 100px
    img
    width: 100% 	

nav
 ul 
   list-style-type: none
   padding: 0
   margin: 0	
   li 
   display: inline-block