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

mark1505, вы можете задавать их в пропорциях типа 0.5fr 1fr 6fr
Или комбинацией с min-content (или max-content), min-content 1fr min-content (две крайние по контенту, остальное центральной)
Можете пользоваться функцией minmax.
Почитайте варианты https://developer.mozilla.org/ru/docs/Web/CSS/grid...

Откат в медии на 1 пиксель - костыль?

Почему именно такая велична, сходу не нагуглю.

Тут https://bootstrap-4.ru/docs/5.0/layout/breakpoints/

Откат в медии на 1 пиксель - костыль?

Рома, он при этом писал min-width или max-width?

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

Антон Литвиненко, да

Как получить значение инпута в режиме реального времени?

https://learn.javascript.ru/events-change-input

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

Антон Литвиненко, прелюбопытно.
В спеке написано, что не наследуются. Ну да ладно, если во всех актуальных браузерах работает, то и ладно.

Так с кастомными
https://codepen.io/AnnaSummer/pen/NWMKzZz

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

Антон Литвиненко,
<div style="--bgi: url()"></div>

div {
  background: var(--bgi) no-repeat;
}

div::after {
  background: var(--bgi) no-repeat;
}

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

Антон Литвиненко, можно через кастомное и туда и туда.
bg image не наследуется.

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

godsplane,

И почему на 4к места не останется если его станет больше?

максимальная ширина красного блока 1200.
Левый magrin от края окна до левого края блока 1200.
Размер окна растет => размер отступа растет.
Но вы же хотите чтобы справа был отступ такого же размера...

На 3000 отступ будет 900, два отступа 1800.
Всего левый блок занимает половину ширины (отступ между блоками опустим для простоты) = 1500.
Из которых 1800 ушло на отступы.

а calc то на основе чего?

На основе ширины в %, половины ширины красного контейнера и gap.

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

Andrew Ruwz, вы можете менять bg size.
Можете задать фон псевдоэлементу, а ему уже transform.

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

godsplane, ну и поставьте два одинаковых margin для block__inner (через calc).

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

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

godsplane, давайте вы покажете на скринах и расскажете исходную задачу, а не какие-то производные от неё.

Потому что сейчас .margin__container имеет левый отступ calc(50% - var(--container-width) / 2)
Вы хотите задать ему же правый паддинг равный этому margin, но пишете 100px.

Это https://codepen.io/Websitio/pen/poyemJv вы чтоль изобретаете?

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

godsplane,

или как сохранить оступ = оступу в у контейнера в гридах?

я не смогла расшифровать это

Текст под текстом в css?

ivangerasimov00, если не жалко трафик пользователей и охота писать кучу лишнего, то норм.
А про семантику всё таки лучше почитать.

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

Как сохранить шиирну по 50% не задавая эту самую ширину в 50%

Задайте flex-basis, если не хотите ширину.

А вообще гридами это делается заметно проще. И не нужна та история с margin.

Текст под текстом в css?

ivangerasimov00, оберните текст и числа в span.
Задайте им display block и text-align по центру.
А также другие свойства шрифта, нужные по макету.

Разметку хорошо бы поменять на dl, dt, dd или table или список.

P. S. Но имеет смысл нанять верстальщика, потому что этот вопрос примерно по первым двум урокам верстки.

Текст под текстом в css?

Попробуйте убрать флекс у item и заменить на всего лишь одно свойство text-align: center
Будет сюрприз.

Текст под текстом в css?

Сделайте песочницу на codepen.io с вашими попытками. Что вы делали и что именно не получилось?
И приложите скрин того, как должно быть.

По дороге можно заглянуть сюда

Зафиксировать after/before в блоке?

Обернуть в div и задать ему relative.
Relative у code убрать.

Как заставить работать CSS:Hover при прокрутке Slick Slider?

Ivseti, всё, последний штрих
замените
a.btn_add_basket:hover:before
на
a.btn_add_basket:hover::before

С одним : устаревшая форма записи.
Псевдоклассы пишутся с :, а псевдоэлементы с ::