Как спозиционировать кнопку?

dmitriu256, Вот 2 варианта
https://jsfiddle.net/qnud15w7/
Кнопка внутри внутреннего блока или внутри внешнего.

Как спозиционировать кнопку?

dmitriu256, паддинг не имеет никакого отношения к абсолютно-позиционированным блокам.

Песочница там -> jsfiddle.net

Как нужно делать, я написала выше.

Можно заработать зная HTML и каплю CSS?

Можно заработать зная HTML и каплю CSS?

Можно заработать даже не зная их.

Причем, в вашем случае, раз нет понимания о качестве работы, лучше действительно делать это в другой области.

Как спозиционировать кнопку?

Скрины и простыни кода это лучше, чем ничего, но разбираться в них не очень удобно.

Пока нет оформленной песочницы, скажут так: всегда есть calc, если позиционировать нужно относительно контейнера, который на всю ширину окна, а не с фиксированной шириной.
Считать позицию удобнее от центра, т.е. left: calc(50% - половина-фикс-ширины)

Семантика, разметка, наименование. Как выглядит идеальная разметка?

white-section

Отвратительно.
Если дизайнер передумает, то будете переименовывать и в html в css или плюнете и зададите красный фон в white-section?
Аналогично со словами top, right и т.д.
Могут быть классы-хелперы, типа h-center. Но используя препроцессоры, они скорее будут примесями.

- Есть ли разница между p и span?

Назначение тегов написано в спецификации. Увлекательное чтение - не пожалеете.

- Как именовать классы?

Название класса должно говорить само за себя (по возможности). Из всех придуманных (всем понятных!) вариантов выбирайте самый короткий.

Если бы я просто для form написал "display: flex"? Насколько это плохо?

Тег form точно такой же тег, как и все остальные.
Обращение к тегам без классов не лучшая практика.

- div, как не перебарщивать?

Лишние обертки они лишние :) Но если это помогает лучше видеть и понимать структуру документа, то они не лишние. div тег безликий, не имеющий семантической нагрузки, если вы добавляете его исключительно для того, чтобы не писать стили для form, то это ерунда.

Так и хочется написать "justify-content: space-between". Это плохой вариант?

Вообще отличный.

- flexbox
Везде пишут - не злоупотреблять. Это до сих пор актуально?

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

- Perfect pixel
Стоит заморачиваться на начальных этапах?

В смысле вначале будете делать свою работу криво, а потом когда-нибудь "вот вырасту большой. полечу в космос" стану делать ровненько.
Заморачиваться с попаданием прямо точечек в точечки не нужно. И шрифты по разному рендерятся и видяшки с настройками разные и контент потом поменяется клиентом.
Но есть разумные допуски, 10-20px по вертикали и 5 по горизонтали для границ блоков (не для текста)

Что делать, если шаблон кривой, а ты центрируешь и распределяешь ровно? - Т.е. реально не симметричное расстояние)

Нужно выяснить причину.
Это дизайнер кривой или так специально сделано, чтобы компенсировать визуальный "вес" элементов.
Дальше по обстоятельствам.

- Когда margin, а когда padding?

По макету.

А как бы вы отталкивали элементы один за другим вниз?

Холиваров по этому поводу и так больше, чем нужно.

Как открыть на сайте в анимированном окне файл из той же папки?

Надим Закиров, какой к черту :target? Извините за резкость. Но не стоит учить новичков костылям. Костыли должны быть сознательным выбором.
А то мне тоже станет "грустно на душе" ;)

Модальные окна делаются на JS.
У ТС там бутстрап уже подключен, как выяснилось в процессе. И осталось только контент вставить в нужные теги.

Как поступить в данном случае?

Как правильно

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

Я бы выбрала флекс и margin.

Как открыть на сайте в анимированном окне файл из той же папки?

lordprettyflackoo, Это делается в одном файле.
В блок пишете нужную информацию, скрываете его например через display:none. При клике на кнопку показываете.
У вас там даже есть класс modal-content намекающий на то, куда нужно размещать информацию.

Как открыть на сайте в анимированном окне файл из той же папки?

lordprettyflackoo,

мне это надо для интерактивности

Что?

Будет проще, если спустя десяток комментариев вы нормально опишете всю задачу.
Что именно вы подразумеваете под интерактивностью?
Почему для этого нужен отдельный файл?

Может, вам vue.js или его друзей поизучать?

Как открыть на сайте в анимированном окне файл из той же папки?

lordprettyflackoo, я уже написала, чтобы на одной странице открыть другую, нужен тег iframe. Как им пользоваться написано по ссылке.

Зачем вы делаете это в разных файлах, а не напишете в одном и просто не откроете модалку с нужной инфой - я не знаю.

Как открыть на сайте в анимированном окне файл из той же папки?

lordprettyflackoo, не вполне понятно зачем.
Но для этого служит тег iframe https://webref.ru/html/iframe

Как открыть на сайте в анимированном окне файл из той же папки?

Я уже прочитала вопрос до того, как вы меня сюда позвали.
Но что-то с догадливостью сегодня.

Что значит пустой фон? И что вы имеете в виду под "на этот фон поместить собственно файл"?

если надо выложу весь код полностью

Это будет разумно. Вот сюда: jsfiddle.net

Проблема border поверх картинки в некоторых браузерах?

Тогда уж тенью, а не outline.
Сами попробуйте сделать это outlin'ом ;)

Как разместить лого по центру меню?

Не использовать float.
Использовать flex.
Для 5го элемента задать margin-left: auto
Логотип поставить абсолютом.

Можно ли из фоновых бэкграундов сделать slick slider?

osimone, логично

Можно ли из фоновых бэкграундов сделать slick slider?

osimone, Люблю неполные куски кода и стилей.
Было бы проще, если бы вы сделали рабочую песочницу на jsfiddle.net или codepen.

Но попробую погадать по неполному куску.
Для каждого слайда вы задаете height: 100%; (Кстати, зачем вы это пишете 4 раза? А если слайдов будет сотня?)
И его родителю .banner_slider тоже высоту 100%.
Но возникает вопрос, а какая высота у banner_slider_wrap? От чего считать %?

Но может, всё и не так.
Будет песочница с видимой проблемой будет и точный ответ.

Можно ли из фоновых бэкграундов сделать slick slider?

Слайды это блоки (div или li или что вам нравится) и им задавайте фон.
В чем именно возникает проблема?

Почему высота ячейки отличается от заданной?

caof19,

и почему верхнии и нижние ряды становятся 21 пиксель, вместо заданных 10

Я бы подумала на минимальный размер шрифта. Но черт знает что там в аутлуке, давно не видела его.

Как исправить ошибки кода html?

Да вся проблема в том, что я понимаю, и в чем суть ошибки. А как правильно ее разрешить - не знаю.

Как разрешить?
1. Посмотреть внимательно на строку из первой ошибки и посчитать в ней кавычки и скобки.
Закрыть их правильно.
А еще лучше перестать писать стили в атрибут.
2. maxlength просто удалить

Так и разбираться, попутно смотря в справочник или спецификацию. Перестать писать атрибуты смысла которых не понимаете.
Вот зачем кнопке autocomplete off? Браузер в нее подставит то, чем пользователь заполнял предыдущие кнопки? Смешно. Убирать доступ с клавиатуры к кнопкам тоже сомнительное дело.

Как можно адаптировать слайдер slick.js для IE?

Максим Крутов,

spoiler