Как сделать галерею на css по типу Masonry?

С column-fill: balance они тоже будут заполняться по столбцам, а не по строкам.
https://codepen.io/AnnaSummer/pen/XWPqQKN

Как сделать галерею на css по типу Masonry?

Взять любой из скриптов делающий такую раскладку и вперед.

На css без js можно сделать только по колонкам.

Откуда берется отступ?

Никита Савченко,
Сделайте песочницу на codepen.io с видимой проблемой.

Откуда берется отступ?

Вероятно отсюда height: 60%;

Многоконечная фигура, внутри картинка - это возможно на CSS?

Константин Баскаков,

чисто на CSS это можно сделать

Чисто на CSS берете эту вашу SVG и засовываете в clip-path. Потом еще раз сверху псевдиком.

;)

Фоновый цвет номеров в нумерованной списке?

Turqut Məcidli, list-style-position

Почему column-gap не отрабатывает?

frontAng, в таком направлении, по столбцам, с js.

Почему column-gap не отрабатывает?

frontAng, этим инструментом, нет, нельзя. Вы видели когда-нибудь в газетах колонки разной ширины? Нет. А это газетная раскладка.

И я бы рекомендовала в вопросе писать именно то, что вас интересует, а не как сейчас.

Почему column-gap не отрабатывает?

frontAng, можно регулировать ширину списка, например, fit-content, min-content и т.д.

Почему column-gap не отрабатывает?

frontAng,

так расстояие между li не такое

Какое не такое? Попросили 40, там 40 и стоит. Специально цветом раскрасила для наглядности.

У li другая ширина

какая другая? В вопросе ни слова нет про ширину.
Колонки всегда равной ширины.

Как правильно сделать выход объекта за пределы грид?

Гуглить что-то типа "контент по центру, фон по ширине", например, вот https://sitist.ru/info-centering-blocks.htm

Собственно, вариантов несколько. Можно обычным гридом на 4 столбца, где средние по половине ширины контейнера, а крайние по 1fr. Или абсолютами.

Как верстальщикам удобнее работать со стилями в figma?

У левого варианта только один плюс: если он есть, то можно надеяться, что дизайнер об этом думал и в макете потом всё близко к этим параметрам.

А так, без разницы.

Как реализовать слайдер как на Авито?

Расскажите, пожалуйста, что у вас не получилось со Свайпером?

Как на 4к мониторе выглядит блок с размерами fulHD?

на fulHD смартфонах всю площадь занимает блок размером 960х540
потому что ретина

че! Вьюпорт телефонов совсем не такого размера. Откройте с телефона https://www.esolutions.se/en/test
Обычно это проясняет обстановочку.

Как на 4к мониторе выглядит блок с размерами fulHD?

Как на вашем мониторе будет выглядеть блок 300px на 300px?
Как 300х300 или занимать всю площадь?

Почему пункты меню вылезают за блок при использованиии flex-direction column?

1. Зачем тут тег CSS GRID, если вопрос заведомо не про него?
2. Это известный баг флексов, гуглите.

Как заменить фоновое изображение с одного на другое в css javascript?

style.backgroundImage

Уже давно есть кастомные свойства.
Их и используйте. Очень удобно.

Самый оптимальным вариантом создания сайдбара по прежнему является float?

Такое ощущение, что вопрос написали 5 лет назад и вот он наконец-то опубликовался.

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

Может, просто взять готовый MouseRobot или типа того?

Обязательно ли загружать scss файлы в хостинг?

Он пригождается в браузере смотреть код благодаря .css.map

Сорсмап всё равно покажет в каком файле написаны эти стили, даже если удалить их с сервера.