Как проверить мобильный экран и скрыть блок?

Daniel Tkachenko, это решит в целом проблему обновления закешированных старых стилей вне зависимости от того, что в них.

А в данном случае, это позволит решить проблему самым простым способом — CSS. Почему CSS: нет сложной логики скрытия + не потребует JS-проверки ширины экрана на всех нужных событиях, чтобы не лишаться возможности скрывать-показывать блок, если человек сжимает размеры окна или тупо поворачивает устройство.

Словом, версию файла я бы в любом случае советовал поставить, это уже стандарт. А как поступит автор вопроса касательно скрытия того блока — тут выбор за ним.

Как проверить мобильный экран и скрыть блок?

sergiocharm, может тогда поставить файлу CSS версию, чтобы браузер автоматически понимал, что у вас обновление, и скачивал новый файл CSS?

Вместо 1 — ваша цифра:

<link rel="stylesheet" type="text/css" href="style.css?v=1"/>

Чем городить вот это всё на JS, когда это идеальная задача для медиазапросов.

Как убрать плавающий скролл при фокусе на поле?

Это везде работает, включая мобильные браузеры (нормальные). В клавиатуре iOS, кстати, тоже есть клавиши смены фокуса полей (стрелки в верхнем ряду, когда активны поля), поэтому там тоже можно переключать поля ввода.

В Android Chrome это доступно, если использовать физическую клавиатуру, либо клавиатуру, где есть такие же софт-клавиши, как в стандартной клавиатуре iOS.

А вообще, tabindex всегда друг за другом идет в рамках одного родителя, поэтому ручное их проставление нужно, если нужно изменить порядок или исключить что-то из зоны фокуса (-1).

Но! Ручное проставление по типу, как вы предложили, кстати, может помочь (ну а вдруг), надо попробовать автору вопроса, но суть проблемы это не решит, это будет лишь хаком поверх проблемы.

Как убрать плавающий скролл при фокусе на поле?

Азамат Шарафутдинов, тут ЛС нет. И почему не скинуть здесь? Не только я один могу помочь, но и куча других людей.

Если боитесь, что могут скопировать код, то я даже не знаю, что вам сказать на этот счёт. Наверное, кому-то действительно может понадобиться вёрстка вашего лендинга, коих в Сети уже миллион. Уже готовых к копированию.

Как убрать плавающий скролл при фокусе на поле?

Азамат Шарафутдинов, весь код.

Шабаш ведьм-программистов, которые умеют по фото определять проблему в коде, я уже устал собирать сегодня. Никто не хочет лететь больше.

Поэтому присылайте весь код.

Как убрать плавающий скролл при фокусе на поле?

LOL, вы аж видео записали, а код приложить было не судьба.

Я с таким не сталкивался за всё время. Похоже на проблему, привязанную либо на баг браузера какой-то специфичной версии, либо на ошибку из-за каких-то манипуляций с JS, которые меняют либо CSS, либо позиционирование.

Можно ли так сверстать без JS?

sorry_i_noob, наверное, потому что знает, как работают свойства CSS и умеет применять их на практике?

Не корректно работает calc(), что делать?

То, что вы используете препроцессор, нужно писать в теле вопроса, тогда бы вам и помогли сразу.

Webpack оптимизация стилей, классов?

VegasChickiChicki, в автоматизации склейки одинаковых свойств с сохранением каскадности.

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

Василий Хрягин, вы о CSS Shapes, которых пока нет в браузерах полноценно. Года через 3 сможете так делать, когда большинство реальных браузеров будет их поддерживать нормально и когда будет возможность делать из блока автоматическую форму:
https://caniuse.com/#search=Shape
https://youtu.be/pOB75oTNhw0

Пока что никаких форм, кроме прямоугольных, в обтекании участвовать не может, если вы хотите полноценной поддержки. И то это всё для текста. Блоки же своей прямоугольной натуры не лишаются.

Делать pixelperfect ломая поведение flexbox или же делать правильно flexbox ломая pixelperfect?

lamer350, согласен полностью. Говорю это и как дизайнер, и как верстальщик.

Когда одному верстальщику сказал, что сетка бывает не только от Bootstrap, он начал спорить. И я понял, что с ним не по пути.

Ну а вообще, это классика, связанная с тем, что людям лень делать что-то иное или вообще что-то в целом делать. Такая же тема с программистами, когда отдаёшь вёрстку, начинаются недовольства, мол, нельзя ли убрать отсюда что-то, оттуда то-то и т. п.

Со всеми, короче, это происходит. Часто это просто лень, чем техническая необходимость. Так что — это норма, главное, чтобы думать умели :))

Делать pixelperfect ломая поведение flexbox или же делать правильно flexbox ломая pixelperfect?

lamer350, поверьте, в любом деле, если нужно что-то хорошо делать, мозги применять нужно. Полгода искал двух верстальщиков в команду, которые умеют думать. Ещё столько же искал программистов, которые умеют делать ровно то же самое.

Сдвиг и возврат блока под раскрывающимся меню?

Сергей delphinpro, LOL, сбор ведьм-программистов объявляю открытым.

Сдвиг и возврат блока под раскрывающимся меню?

Как-то можно решить, но мы об этом никогда не узнаем.

Как выровнять по высоте эти блоки?

Код где?

Как оптимизировать запись SCSS?

Дополню, что тут используется BEM, а зачем в случае BEM вложенные селекторы? Правильно, не нужны, поэтому , если сдедовать первой структуре, следует использовать @at-root в дополнении к переменной с именем компонента.

.list {
    $self: &; // я люблю так записывать имя компонента, как и западные товарищи

    @at-root #{$self}__item {

        &:first-child {

            #{$self}__link { // тут @at-root не нужен, ибо вложенность нужно сохранить
                //
            }

        }

        @at-root #{$self}__smth {
          //
        }

    }

    @at-root #{$self}__link {
      //
    }

}

Это будет генерировать вот это на выходе, без лишней вложенности:

.list {
    //
}

.list__item {
    //
}

.list__item:first-child .list__link {
    //
}

.list__smth {
    //
}

.list__link {
    //
}

Как можно реализовать блок с рассадкой людей в зале?

Конкретно это можно спокойно сверстать. Блоки, контейнеры и куча блоков (посадочные места). У вас там всё прямоугольное и схематичное, т. е. не сохраняет, как я вижу, геометрию зала.

SVG — то же самое. SVG — это код:
https://medium.com/@mattcroak718/creating-an-inter...

Как сделать чтобы placeholder был сверху поля ввода?

Артем фамилия, спасибо :))

Как сделать чтобы placeholder был сверху поля ввода?

Артем фамилия, короче, типа того, зачем тут что-то скрывать?


Или так, для доступности, с label:


Нужна анимация? JS в помощь:
https://speckyboy.com/floating-form-label-plugins/

Пока что не используйте CSS-метод а-ля этого, ибо не все браузеры нормально не работают с этим input:placeholder-shown. Или вообще не работают. Ну а так, через пару лет можно везде спокойно использовать CSS, чтобы делать так:

Как сделать чтобы placeholder был сверху поля ввода?

Артем фамилия, а зачем он должен в вашем случае скрываться, когда он не мешает вводу текста?

Ну а так, если нужна анимация и т. п., то пока на CSS нельзя пользоваться одним свойством, которое проверяет наличие заполненности поля, оно экспериментальное. Ваш выход JS.

Опять же, я не знаю, зачем вам это в вашем случае.