Делаю эмаилы картинки не отображаются?

pologenki, тык на картинку

Почему не работает проверка ответов?

Вот ваш код https://jsfiddle.net/vom86axL/ и он работает

Не работают там лейблы, это да.

В следующий раз делайте песочницу с демонстрацией проблемы самостоятельно.

Как сделать чтобы не обрезался кастомный селект?

boxFight, еще раз медленно: вынимаем селект из таблицы (можно на js). Помещаем в разметку снаружи.
На том же JS выясняем где нужно разместить этот селект. Задаем координаты.
Для удобства можно сделать обертку равную размеру таблицы. В ней будет таблица и перемещенный select. Так вам будет проще работать с координатами.

Как сделать чтобы не обрезался кастомный селект?

boxFight, потому что если он будет внутри, то overflow будет его обрезать

Как сделать чтобы не обрезался кастомный селект?

boxFight,

Рассматривался вариант через абсолют ,но проблема в том, что он будет не последним элементом в таблице.

Он вообще не будет в таблице

Как сделать чтобы не обрезался кастомный селект?

Ответ очевидный. Вынуть его из overflow. Например, вешать сверху абсолютом. Или перевесить overflow так, чтобы он не обрезал селект. Если overflow в принципе нужен.

Альтернатива: открывать наверх, а не вниз.

При клике на бургер меню должны добавляться классы, где ошибка?

Rys17,

но у меня при нажатии ничего не происходит.

В песочнице нет стилей.
Допишешь - будет видно, что всё работает.

Если в своем коде руками добавляешь классы (как бы работая вместо скрипта), всё правильно функционирует?
Если да - то проверяй подключение скрипта. Оно должно быть перед закрывающим </body>
Если нет - то проверяй, что в стилях к этим классам.

Как сверстать такой radiobutton?

Только инпут давно не надо скрывать.
apperance: none прекрасно работает (в современных браузерах уже без префиксов) и позволяет стилизовать прямо радио. Даже псевдо работают.

Почему изображение (img) в flex-контейнере ведет себя "странно"?

redfoxy19733,
https://codepen.io/AnnaSummer/pen/RwmjXmm - вот песочница

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

spoiler

Но основной постулат всё равно один: адаптивные картинки лучше оборачивать во что-нибудь (div, figure, ссылка - по обстоятельствам)

Реализация блоков с разным размером, css grid, как правильнее сделать?

Антон Вебсайтовский, https://codepen.io/AnnaSummer/pen/QWRapbX

Реализация блоков с разным размером, css grid, как правильнее сделать?

Антон Вебсайтовский, это вариант не на флекс, это вариант на абсолютах...

В какой тег будет правильней отнести профиль, корзину и бургер меню (в мобильной версии рядом с корзиной)?

Можно ли сделать два nav

Можно

А можно и лучше в один. Внутри один список со ссылками.
Если прям тяжело, то два списка.

А бургер лучше не в nav. Или хотя бы не в список внутри nav.

И использовать первый пункт из этой прекрасной статьи
11 вещей которые я узнал, читая спецификацию flexbox

Имеет ли смысл использовать абсолютное позиционирование?

Имеет ли смысл использовать абсолютное позиционирование?

Можно и абсолютами.
Но гридами элементы остаются в потоке, знают друг о друге не наползут друг на друга.

Контентная картинка у вас там одна: логотип. Остальные это украшения, т.е. фоны, псевдоэлементы...
Все облака с теткой объединить в одну картинку и сделать фоном. Если там нет затей с анимацией.

Реализация блоков с разным размером, css grid, как правильнее сделать?

Антон Вебсайтовский,

.block {
        grid-template-columns: repeat(3, auto);
      }
      .item-1 {
        align-self: end;
        justify-self: end;
      }
      .item-2 {
        align-self: end;
        justify-self: start;
      }
      .item-3 {
        align-self: end;
        justify-self: start;
      }
      .item-4 {
        align-self: start;
        justify-self: end;
      }
      .item-1 {
        align-self: start;
        justify-self: start;
      }

Реализация блоков с разным размером, css grid, как правильнее сделать?

Антон Вебсайтовский, ещё раз: грид, три колонки, две строки по контенту или авто. Всё.

Реализация блоков с разным размером, css grid, как правильнее сделать?

Антон Вебсайтовский, теперь стало 12 равных колонок.
Откуда вы их берете?

Три колонки по контенту.
+ align-self и justify-self.

Но если там у дизайнера и правда 12 колоночная сетка (на скрине ею и не пахнет, но может неудачная картинка), тогда остается только правильно раздать колонки.

Реализация блоков с разным размером, css grid, как правильнее сделать?

Начать нужно с простого

grid-template-columns: repeat(3, 1fr); /* Три колонки одинаковой ширины */

Вы видите в макете 3 колонки одинаковой ширины?
Нет?
И я нет.
Так зачем пишете в css, что они одинаковые?

Дальше варианты могут различаться, но align-self и justify-self помогут.

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

CSS и text-transform вас не устроит?

Почему изображение (img) в flex-контейнере ведет себя "странно"?

xdevelx, 2dpr вижу.
Что картинка не уменьшается меньше родной ширины - не вижу.

Точнее не так. Если бы у картинок не была бы задана максимальная ширина 100%, то да уперлась бы в 640, как на ваших скринах.
Но в оригинальной песочнице есть эта максимальная ширина и картинка продолжает сжиматься.

Но ладно, что вы имели в виду поняла, спасибо.

Почему изображение (img) в flex-контейнере ведет себя "странно"?

xdevelx, мне не видно саму картинку, но её урл говорит о том, что она 320х240

https://images.pexels.com/photos/617278/pexels-photo-617278.jpeg?auto=compress&cs=tinysrgb&dpr=2&h=240&w=320

Но даже если её родной размер 640, то не вижу причин почему бы ей не сжаться ещё меньше.

Вот песочница с картинкой без vpn и с оригинальной шириной 1020 и она хорошо сжимается довольно долго. Дальше начинает мешаться текст без переносов