Как правильно верстать баннер интернет магазина?

Если контент не важен, а важно только чтобы посетитель посмотрел и кликнул, то можно и картинкой. (Только не забудьте про разные размеры для разных устройств, ретину..)
А если текст важен для людей, нужно чтобы он был доступен скринридерам, поисковикам и т.д., а также должен редактироваться из CMS, то верстать как обычно.

Где ошибка в коде html?

Ошибки в HTML ищутся с помощью валидатора https://validator.w3.org/nu/

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

Кажется именно этому учат в Практикуме.

Как реализовать такой скролл на сайте? https://logo.localkitchen.ru/ Может имеются какие-то плагины для этого?

Kamil,

а можете пожалуйста написать подробно как это сделать?

Нажимаете F12 или ctrl+shift+I
https://habr.com/ru/company/simbirsoft/blog/337116/ статья 17 года, для начала норм.
https://developer.chrome.com/

Как сделать выпадающее меню для товаров?

Погуглите про $this и родственные связи.

Как реализовать такой скролл на сайте? https://logo.localkitchen.ru/ Может имеются какие-то плагины для этого?

Kamil, на сайте-примере всё можно посмотреть в исходном коде.
Проверяется скролл и в зависимости от него меняется z-index, top и т.д.

В основе flex или inline-block?

Foxizix, нет, это разные значения. Ещё инлайн-флекс можно было бы попытаться сравнивать с инлайн-блоком... хотя и это разные вещи.

Как менять стили при наведении на тег area?

Артем Рассадин, дольше спрашивать, чем обвести контуры.

Как менять стили при наведении на тег area?

В современном мире практически перестали использовать map и area.

А такие карты как у вас, рисуют в svg, а там нет проблем с наведением на отдельные области.

Какой курс и в какой организации выбрать (веб-разработка)?

Стартовые знания/навыки: middle

Систематизировать имеющиеся знания

Извините, но эти две фразы не сходятся.
Т.е. если в компании один разработчик, то он будет и сеньором, конечно. Но в среднем по больнице выходит ерунда.

Получить новые знания, обрести и перенять опыт ментора

Вот ментора и ищите. Показывайте свой код, просите код ревью, задавайте вопросы и т.д.

Почему не работает a:hover?

TRAZAN,
Тут

background-size: 200 100%;
-webkit-background-size: 230 100%

1. Вы забыли единицы измерения
2. Разные размеры в основном свойстве и свойстве с префиксом
3. Неверный порядок свойства с префиксом и основного
4. Для свойства background-size вообще не нужны префиксы

И в анимации пишется так cubic-bezier

Возможно ли без медиа запроса переносить блоки друг под друга в мобилке без фикс ширины?

Поддерживаю оба комментария выше.

Хочу обратить внимание на проблемы последней строки.
Но тут вам поможет nth-child и вот эта статья
https://css-live.ru/articles/resheno-s-pomoshhyu-c...

Как сделать адаптивное поле ввода input?

Есть ещё атрибут contenteditable="true"

Почему при наполнении текста ломается верстка?

.programs .container .wrapper .programms__item .programms__info .wrapper .programs__link a img

Это ... любое неприличное слово.
А если вы ещё и БЭМ используете, то совсем ужс.

Вложенность селекторов больше двух-трех это дурной тон и выстрел себе же в ногу.

Пытался ограничить текст с помощью width, ничего не получилось.

В коде этого не видно.

Чтобы обрезать текст, кроме width потребуется ещё overflow и text-overflow.

Сделайте пример в песочнице codepen.io
Желательно уже с нормальными селекторами.
Каринки можно заменить на любые или использовать заглушки.

Как вставить тег br, чтобы числа выводились с новой строки?

Хоть так
document.write(i + '<br>');

Скрыть div при не пустом input?

https://codepen.io/AnnaSummer/pen/xxYygyK
Адаптируйте появление и поведение под себя.

Как сделать перенос блока на новую строку если он не влезает?

Дело в том, что по умолчанию блоки сами по себе начинаются с новой строки.

Если речь про флексы, то у них есть свойство flex-wrap со значением wrap.

Если всё не так, то прикладывайте к вопросу код в песочнице codepen.io (правильнее делать это прямо при создании вопроса, чтобы мы не играли в угадайку)

Не загружается background. почему?

Антон Горецкий, кавычки необязательны если нет пробелов

Не загружается background. почему?

Путь указан верно! Точно!

Все лгут.
Т.е. либо сам путь указан неверно либо картинки нет в той папке по какой-то причине (например, недогрузилась на хостинг)

Картинка загружается через тег img src="img/bg.jpg

Значит, у неё верный путь относительно страницы, но неверный относительно файла стилей.

Абсолютные и относительные ссылки

Вероятно, что-нибудь такое
background: url(../img/bg.jpg);
если стили лежат в папке css, которая находится на одном уровне с index.html

Header и footer сдвигаются в право, что делать?

Когда вот эта штука https://validator.w3.org/nu/ перестанет показывать ошибки вашего кода, всё выстроится заметно ровнее.

Как правильно задать размер блоку?

Без макета сложно сказать, что конкретно делать в вашем случае.

Но есть гриды, есть max-width (и min-)

Задал ширину, сказали плохой тон

Да и это ерунда.
Если блок при любых обстоятельствах (на всем сайте или на определенном интервале вьюпортов) должен быть 500px, то было бы странно извращаться как-то по-другому.

А вот если его ширина от чего-то зависит, то так и нужно писать в стилях.