Саша

встречаются примеры с дублированием из тега в , что не подходит.

иначе никак. поскольку по природе канвас предназначен не для видео.

https://developer.mozilla.org/en-US/docs/Web/API/C...
и тому подобное.

Решила вопрос следующим образом:
делаю три отдельные таблицы внутри одной большой. В каждой таблице всего одна строка с одной ячейкой, в ячейке два span со свойством display: block.
Так визуально у нас получается будто бы две строки по 3 ячейки в каждой.
На мобильном через медиа-запросы задаем адаптивность для каждой таблицы (чтобы она занимала 100% ширины) и для каждого span-а такие параметры:
display: inline-block;
width: 130px; (тут ширину можно взять произвольно, просто именно с такой в моем случае на экране мобильного оба блока помещаются в одну строку и не перестраиваются друг под друга).
Плюс задаем нужные нам отступы, что блоки не прилипали друг к другу.

Спасибо всем, кто откликнулся и предложил свои варианты!

Стоит, но работать может не во всех клиентах. Согласен с Nikolay Petyukh, что верска писем отдельное, сложное направление. Пользуюсь stripo.email для верстки и emailonacid.com для проверки отображения.

Потому что координаты должны быть

var coords = [[55.765326, 37.627735],[55.637366, 37.719745]];

, наверное ;)

Зачем гадать, если можно измерить. Например.

Автопрефиксер отрабатывает после сохранения файлов в папку app/css
вот пример правильного таска

gulp.task('default', function () {
    return gulp.src('css/*.css')
        .pipe(autoprefixer({
            browsers: ['last 3 versions'],
            cascade: false
        }))
        .pipe(gulp.dest('app/css'));
});

Давайте попробую по пунктам:

Почему (Mobile First) или (Desktop First) лучше ;
Почему (Mobile First) или (Desktop First) хуже ;

что-то из серии "Что лучше, ложка или вилка?" Ну Вы поняли... Это вопрос исключительно удобства и он напрямую зависит от того, какой у Вас исходный шаблон, и в какую сторону его проще будет адаптировать. Но даже и в этом случае, слово "лучше" тут мало уместно, скорее это вопрос удобства. Мы (в общей сложности человек 50+, от студентов до матёрых разработчиков) взяв за основу ряд параметров с отметкой "нужно делать вот так" от Google PageSpeed провели массу тестов и дискуссий... В результате которых, едино правильного подхода найдено не было. Самый удобный с точки зрения здравого смысла, был такой вариант:
1. Сначала пишем все общие стили, описывающие цвета, шрифты и всю такую ерунду
2. Для каждого диапазона разрешений создаём свой стиль-корректор, который описывает (корректирует) позиционирование элементов, их размеры, размер шрифта и т.д.

Таким образом, как Вы понимаете, "first" вообще отпадает как таковой, получается "and". Но Google'у не нравится такой подход, он просит запихивать "все важные стили" в , и отделить в таком режиме "важные стили" от "не важных" невозможно, т.к. степень "важности" определяется в зависимости от разрешения устройства. Но, говоря исключительно о личном удобстве - удобнее - начинать с мобильной версии, т.к. она априори "меньше" и расширить элемент гораздо проще, чем "слепить более мелкую его версию".

Производительность (Mobile First) или (Desktop First) ;

На производительность это в общей сложности не влияет никак, т.к. Вы банально даже JS'ы можете подгружать нужные на нужное разрешение, по этому вопрос производительности тут вообще сложно обозначить. Хотя, конечно можно опираться на такое условие как "мобильные всегда медленнее чем стационарные устройства", и из этих соображений, если такое условие "сильно вывернуть" и возвести в ранг абсолюта - тоже будет логичнее сначала делать "Mobile first".

Где и каким сайтам подходит (Mobile First) или (Desktop First) ;

MobileFirst по определению идеально подходит тем сайтам, которые изначально (в первую очередь) рассчитаны именно на мобильные устройства, например какой-нибудь "музыкальный сервис онлайн, с возможностью прослушивать MP3'шки в качестве 32-64Кбит, специально для тех у кого кончился трафик и интернет работает с ограничениями скорости". Остальное я описал выше :)

https://jsfiddle.net/L30qqawj/ либо трансформациями
www.cssportal.com/style-input-range
А это для коллекции ionden.com/a/plugins/ion.rangeSlider/demo_advanced.html

Сначала input, потом слайды и label.
И одни должны быть на одном уровне, чтобы работали соседние селекторы ~

Речь об этом? https://jsfiddle.net/4yn093y6/

javascript

$(window).scroll(function(){
if($(window).scrollTop()>0){
$('.element').addClass('fixed')
}
else if($(window).scrollTop()>$('.bottomElement').offset().top){
$('.element').removeClass('fixed')
}
})

Например с помощью jQuery плагина: leafo.net/sticky-kit/#examples