Как сделать центральный слайд больше?

an, ну и причем тут тогда свайпер и формулировка вашего вопроса?

Переформулируйте вопрос, смените теги на актуальные, укажите cms или что там у вас.

Как сделать центральный слайд больше?

https://qna.habr.com/q/1200296

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

Вот какой-то древний пример на jsfiddle (в России нужен VPN, но мне лениво переделывать на codepen)
canvas https://jsfiddle.net/Ankhena/mkf6h0zp/
gradient https://jsfiddle.net/Ankhena/0phh2of9/

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

Судя по тому как они обрезаются по краям, это вообще не блоки.
А либо фон (градиентиками) либо сетка на canvas.

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

Sergei Nazarenko,

или ошибку выдаёт.

Именно это оно и делает. Откройте валидатор.

Нельзя это когда ты сделал и оно не работает

Нет гарантии, что все браузеры будут одинаково обрабатывать невалидный код.

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

Обратите внимание на то, что div нельзя вкладывать ни в span ни в button.

Как изменить позиции блока и pagination в Swiper.js?

2. Какие свойства надо изменить, что бы иконка человека чуть выходила из-за блока и не обрезалась?

Либо padding либо и паддинг и позиционировать относительно текста, а не слайда.

3. Какие свойства задать пагинации что бы она была ниже блока и не обрезалась?

Вынуть её из блока с overflow и позиционировать как хочется.

Как растянуть дочерние блоки на фиксированную высоту блока родителя?

pashjka, вам поможет:
1. max-height для ограничения высоты блока и картинки
2. overflow для включения прокрутки для текста (или скрытия его вовсе), когда он выпадет из блока.
3. flex-grow, чтобы растянуть блок с текстом на всю оставшуюся от картинки высоту (альтернатива единицы fr у грида)
4. object-fit для вписывания картинки в блок
5. aspect-ratio или хак с паддингом (гуглится) для пропорций
6. flex-direction: column, если вы вообще про него забыли (это так, на всякий пожарный).

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

Как растянуть дочерние блоки на фиксированную высоту блока родителя?

А если текста больше чем на 300px, куда должны деваться излишки и что должно происходить с картинкой?

Вообще это больше проблемы с геометрией, а не с флексами.

Как только вы поймете геометрию, останется переписать это на css. (Можно на гриды, будет удобнее)

Как в flexbox сделать карточки гибкими в row как в grid?

Speakermen, вы задали flex-basis 25%. 4х25% это уже 100%, а вы ещё хотите отступы.
Вам нужен calc
типа calc(25% - 24px*3/4);

Но я бы, конечно, гридами, потому что вообще не будет проблем с пересчетами при изменениях размеров.

Как в flexbox сделать карточки гибкими в row как в grid?

Speakermen, гридами это делать заметно проще.
Флексами вам будет нужен calc для ширины (или basis).

Оформите песочницу с видимой проблемой на codepen.io

Как сделать, что бы текст не "Улетал" от чекбокса?

Nik Faraday, начните с изготовления песочницы на codepen.io с текущим кодом и видимой проблемой.
Сюда ссылку и позовите.

Как сделать, что бы текст не "Улетал" от чекбокса?

Вы, наверное, понимаете, что в данном случае вам поможет что-то типа фотошопа?

А так у вас богатый выбор:
- флексы
- гриды
- абсолюты
- инлайн-блоки
- и даже флоаты

В некоторых вариантах потребуется дополнительная обертка для текста (хотя, судя по скрину, она у вас и так есть и при ваших стилях играет скорее негативную роль)

Как растянуть текст на весь болк?

text-align:justify; растягивает (делает равные промежутки между словами) по горизонтали все строки кроме последней.
Также не растягивает строки с br.

Не очень понятно при чем там вертикаль.

Ну и почтовые программы могут вносить свои коррективы.

Как писать стили под все типы устройств (по высоте)?

stanislavkm,

к примеру есть два мобильных устройства с одной шириной, но абсолютно разной высотой. контент ведь будет выглядеть по разному (условно, на одном блок текста будет на 30% от экрана, на другом на 90)

Черт с ней с версткой.
Нарисуйте, пожалуйста, два макета, оба с шириной 360, один с высотой 400, другой 700 (высоту можете выбрать на ваш вкус). И сделайте так, чтобы выглядело одинаково.

Как в flexbox сделать карточки гибкими в row как в grid?

Пока не всё понятно.
Вы хотите, чтобы 4 карточки по 240 поместились в 960 и между ними еще должны быть отступы по 24px?

Как сделать прокрутку внутри модального окна?

Ну да, на js существенно длиннее.

const modal = document.querySelector('.modal')
document.querySelector('button').addEventListener('click', () => {
  modal.classList.toggle('hidden');
  modal.scrollTop = modal.scrollHeight;
})

говорят, что не модно

Вообще-то вам говорили не про моду, а про целесообразность. В этом вопросе у jq нет преимущества.

Но самое главное, что в вопросе ванилька, а не jq. Так что спорить тут не о чем.

Как стилизовать неполный border?

serrrezhka, и как тенью от кнопки можно сделать рамку уголками у родителя?

Как сделать прокрутку внутри модального окна?

Александр Цымбал,

Убедитесь, что у #messagelist включен вертикальный скролл в css: overflow-y: overlay;. Ankhena, пожалуйста, подскажите, моден ли данный способ включения прокрутки в 2022?

У свойства overflow-y нет значения overlay.
Так что вряд ли этот способ модный.

Да, это jQuery. Сейчас меня обвинит куратор тега CSS, что jQuery не модно в 2022?
В то время как jQuery используется в 2022 на 70% сайтов.

Ваш код короче чистого js на немножко символов, а тянет за собой библиотеку.
Но да, если на сайте уже подключен jq, то нет причин его не использовать.

Правда, зачем бы тогда спрашивающий писал на чистом js...

Как зафиксировать, чтобы header был вверху, а footer внизу?

Александр Цымбал, ещё есть sticky, который хотя бы решает проблему с неизвестной высотой.