Как рассчитать значения на которые произошел scale?

EryTi,

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

Если блоку задать размер 500px и запретить всякие flex-shrink и т.д., то он так и останется шириной 500px.

Также есть мета тег vieport и фиксированная ширина в нем вместо device-width
Либо использование единиц vw (vh, vmin, vmax) как раз для масштабирования. И функции min, max и clamp, чтобы совсем не увлечься.

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

Почему CSS не видит классы HTML, но при этом их применяет на странице?

Почему CSS не видит классы HTML, но при этом их применяет на странице?

Применяет потому что применяет браузер, а не vs code.
Почему не видит vs code не знаю, с ним бывают такого типа проблемы. Обычно помогает перезагрузка/переустановка.

Как рассчитать значения на которые произошел scale?

Мне кажется, что вы решаете не ту задачу. Скорее всего, текущая проблема это следствие неверного решения предыдущей задачи. И если знать её, то, возможно, и решение будет поприличнее.

В текущем коде уменьшать нужно container либо вообще его убрать.

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

Нормальным представляется решение сразу менять размеры, а не масштаб.

Не запускается gulp, проблема со шрифтами, как исправить?

Есть объяснение, зачем при каждой сборке конвертировать шрифты из ttf в woff?

А по теме нужно проверять версии node.js, gulp и пакетов.
Вот, например "gulp": "^5.0.0" Сколько там 5му галпу деньков от роду?

Как подключить этот font-face генератор?

dima89e, ещё раз: в нём нет смысла. Не нужны сейчас ни ttf ни otf ни вся та ерунда, которую вы зачем-то хотите писать. Это миксин из прошлого.

Почему не применяются изменения в адаптиве CSS?

Чтобы был адаптив:
1. Должен быть соответствующий meta тег
2. Стили для обычного состояния и измененные должны быть написаны в правильном порядке и с правильной специфичностью.

Как проверить:
Открыть инструменты разработчика, выделить проблемный блок и на вкладках Styles и Computed (если мы про Хром) посмотреть какие стили применились и почему не те, которые вы хотели.

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

Делайте пример в песочнице типа codepen.io

Как подключить этот font-face генератор?

Что же вам неймется? Остался один актуальный формат шрифтов: woff2. Даже если вам нужно поддерживать какие-то древние браузеры и просто woff, то это всё равно меньше строк, чем в тоё простыне, что у вас выше.

Просто подключите обычным способом и оставьте мозг в покое.

Оформление полной карточки о товаре, фото, и мини фото, плюс видео, как реализовывают?

Александр Васильев, и я за swiper

Может какой-то есть готовый скрипт, а то обычно я из слайдера делаю или что-то типа того, но не всегда хорошо.

В целом, логично делать слайдер из слайдера. Он же готовый скрипт.

Owl когда-то нравился, но у него JQ в зависимостях и были проблемы с флексами и гридами. Возможно, пофиксили. Хотя, кажется, его кучу лет не обновляли.

Возможно ли перенести свой дизайн на сайт WordPress?

Возможно ли перенести свой дизайн на сайт WordPress?

Да, конечно.

или такой дизайн для WordPress невозможен?

Любой дизайн "цепляется" к любой CMS. Возможно, для упрощения и удешевления работы, с некоторыми нюансами.
Если уже при верстке знать к какой и её особенности, то будет легче.

Может, есть какие-нибудь плагины или что-то типо того...

Нет. "Само" оно не догадается что и куда нужно разместить.

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

Есть фриланс. WP широко распространен, поэтому и исполнителей достаточно много.

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

У вас в макете SVG, её и используйте

Как реализовать шторку на двух кратинках?

Такого добра полно на codepen. Ищите что-то типа слайдер before-after

clip там не нужен, достаточно обычного флекса и overflow

Как сделать наложение фона на inline?

Сергей Дроздов, поменяйте цвет текста, будет проще

Как позиционировать элементы/блоки, относительно других элементов/блоков(например, панели навигации, логотипов и т.п.)?

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

Как сделать наложение фона на inline?

background или background и псевдоэлементы

Как позиционировать элементы/блоки, относительно других элементов/блоков(например, панели навигации, логотипов и т.п.)?

Начать нужно с вопроса зачем там вообще абсолют? Максимум кому он нужен это стрелки.

Создаете класс container, задаете ему параметры ширины (по примеру как в шапке) и центрирование и применяете его и в шапке и в слайдах и там где он еще нужен.



Альтернатива: гриды.

Почему не работает checked?

Соседние селекторы вам не помогут при такой разметке.
Используйте :has

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

leeroyjenkins176, нужно разобраться с контейнерами и их размерами, а потом всё таки object-fit

Как в js сделать ссылку верхнего блока не кликабельной при fixed со скроллингом?

Шигаев.,

Однако здесь не хватает того самого триггера.

А это window.addEventListener('scroll', function() что?
Если всё таки не в момент старта, то можете воспользоваться своими же промежуточными расчетами прозрачности.

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

leeroyjenkins176, либо переформулируйте вопрос и последнее предложение либо всё таки погуглите.

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

Гуглите object-fit