Как сверстать центрированный лендинг с разными цветами блоков?

Олег Кокошинский, именно.

Где код или картинка, как должно быть?

Как сверстать центрированный лендинг с разными цветами блоков?

Ну вообще, алгоритм такой: делаете то-то вот там-то там-то, и всё это работает вот так-то так-то.

Как задать ширину таблицы в мобильной версии?

Максим, изучайте правила наследования и порядка стилей. Там несложно.

Как задать ширину таблицы в мобильной версии?

Максим, медиа-запрос поставьте после объявления основных стилей (257-я строка). Сейчас они выше по коду (240-я строка).

P. S. В коде этого ответа — правильный порядок.

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

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

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

Olek1, если что, анимировать это дело можно тоже хаками:


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

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

Olek1, можно там, можно в личном аккаунте на CodePen или JSFiddlle — как хотите :))

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

Olek1, сам написал, не знаю, насколько он известен. Но он не универсальный, к сожалению, с учётом тех недостатков, что я описал выше.

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

pahanmcs, можно обойтись без ID вообще, если структура вся внутри label:



Но тогда нельзя сделать нормально клики внутри (по ссылкам, например) + вся область становится переключателем спойлера, а не только кнопка или заголовок. Так что — JS ваш друг навек.

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

profesor08, Firefox тоже поддерживает, поэтому на круг Firefox, Chrome и Safari.

Но это я привёл больше к тому, чтобы сравнительно привести человека к JS-варианту по типу вашего. Он выше писал, что хочет без JS и хака на input'ах.

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

Ещё можно задействовать details, если поддержка со стороны браузеров устраивает:
https://www.w3schools.com/tags/tryit.asp?filename=...

Верстать эти блоки хексагоны или отказатся?

Можно запросить картинками, а можно сделать изначально закругление, а через конечный вид сделать с помощью clip-path через запрос support, если будет поддержка clip-path.

Как правильно подключить платный шрифт на сайт?

Predaytor, о лицензии и её условиях вы можете узнать при покупке шрифта на той площадке, где, собственно, и покупаете.

А так, если проект крупный, не рискуете. Если какой-то а-ля лендинг — то можно.

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

Денис, проценты — относитель родительского блока. Viewport-единицы — относительно viewport'a.

В таком контексте их не используют, ибо это не адаптивность.

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

Денис, да, font-size в vw.

Как HTML-код, написанный в одну строку, преобразовать в несколько строк в зависимости от глубины вложенности тегов?

Не удержался:
https://google.gik-team.com/?q=sublime+text+3+auto...

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

Пропорциональное изменение размера ≠ адаптивность. Если нужно именно пропорциональное изменение размера (чтобы вписывался в экран), используйте viewport-единицы для всего внутри блока (включая шрифты). В данном случае всё должно плясать от vw.

Либо придумывайте нормальную адаптивность.

Как сделать выезжающую карточку на CSS?

Илья Резник, z-index.

Как сверстать подобное?

Александр Коновалов, мне это ни о чем не говорит :))

Как сверстать подобное?

Плюс, я вижу закругление на краях, которого не было на скриншотах. Это закругление будет искажаться и этого не избежать. Проще отказаться от него (как на скриншоте в описании вопроса).