如何使横幅上方的卡片布局重叠

Question

我需要顺风进行设计。检查下面的大纲参考资料，请帮助我。需要构建相同的设计。我用过

<div class=“mx-auto max-w-full p-4”>

<img src=“”>
</div>
<div class=“max-w-md md:max-w-xl lg:max-w-7xl xl:max-w-screen-2xl mx-auto relative -top-[8em] z-10”>
<div class=“rounded-lg shadow-md py-8 md:py-16 text-center bg-white”>
<input type=“text”>
</div>
</div>

但是它显示更多顶部并且移动设备没有响应。图片部分被剪掉了更多部分。

Answer 1

<div class="h-[50vh]">