Как в блоке «Спасибо что доверяете» сделать тень для каждого второго элемента и чтобы он был выше остальных блоков?
Как в блоке "Спасибо что доверяете" сделать тень для каждого второго элемента и чтобы он был выше остальных блоков?
Сайт на котором верстка ведется
Как должен выглядеть слайдер в блоке "Спасибо, что доверяете"
Код тени: box-shadow: 0px 0px 54px 0px #00000021;
Дополнительно:
А вы уверены, что это именно каждый второй, а не активный слайд?
Я нет.
Собственно, сдвигаете активный (посмотрите класс) слайд (любым удобным способом, трансформ, margin, align-self и т.д.) и добавляете тень.
Тогда блоки при переключении перестанут прыгать
Ответы:
Если я правильно понимаю, то тут нужно идти через псевдоселектор :nth-child(even), чтобы выбирались каждые четные элементы. Но вот не помню к чему он должен применяться: к контейнеру или к самим элементам.
- К элементам.
Опишите проблему, и специалист поможет с настройкой, исправлением ошибки или доработкой сайта. Подберём понятный план работ без лишней переписки.
Пока нет других ответов. Будьте первым, кто поможет автору.
Ответить на вопрос
Для добавления тени каждому второму элементу в блоке "Спасибо что доверяете" и чтобы он был выше остальных блоков, вы можете использовать следующий CSS код:
.thank-you-block { display: flex; flex-wrap: wrap; } .thank-you-block .block { width: 200px; height: 200px; margin: 10px; background-color: #f0f0f0; position: relative; } .thank-you-block .block:nth-child(even) { box-shadow: 0 0 10px rgba(0, 0, 0, 0.5); z-index: 1; }
В данном коде мы используем flexbox для распределения блоков внутри контейнера "thank-you-block". Затем каждому блоку присваивается ширина, высота, отступы и цвет фона. Для каждого второго блока (через псевдокласс :nth-child(even)) добавляем тень с помощью box-shadow и устанавливаем z-index, чтобы он был выше других блоков.
Таким образом, с помощью данного CSS кода вы сможете добавить тень каждому второму элементу в блоке "Спасибо что доверяете" и сделать его выше остальных блоков.