Есть контейнер, внутри (или поверх) которого располагаются карточки. Вопрос в том как сделать так, чтобы пространство между карточками было белым (или просто не отображался контейнер) а внутри самих карточек видно контейнер.
В целом первоначальная задача: сделать карточки у которых будет "общий градиент" и который будет отображаться только в них.
После изображений прикладываю код и что имею на данный момент. На 1 изображении - прозрачные карточки без наполнения поверх градиента (показать, что он как бы общий). На втором - то, к чему я стремлюсь.
Такой код я имею на данный момент и скрин того, что получилось. gradient-cards
это класс самого градиента: background: 'linear-gradient(71.92deg, #44B3FF 0%, #FF73E1 72.4%)'
<div
class="relative grid h-[1000px] w-[1300px] grid-cols-[repeat(4,minmax(300px,300px))] grid-rows-3 gap-5 p-5 font-serif text-white shadow gradient-cards"
>
<div class="card flex h-[300px] w-[300px] flex-col items-center gap-y-[30px] rounded-3 bg-transparent p-5 shadow">
<img src="" alt="Вот и нет картинки" class="h-[150px] w-[260px] bg-[#E4E4E4] text-black-blue" />
<p class="text-center text-h3">Пара строчек текста</p>
</div>
<div class="card flex h-[300px] w-[300px] flex-col items-center gap-y-[30px] rounded-3 bg-transparent p-5 shadow">
<img src="" alt="Вот и нет картинки" class="h-[150px] w-[260px] bg-[#E4E4E4] text-black-blue" />
<p class="text-center text-h3">Пара строчек текста</p>
</div>
<!-- . . . -->
</div>