Html div内的内容不'；不完全出现？

我想做一个一页的网站，我正在使用引导列。缩小屏幕时出现问题，处于

位置：absolute

的表单内容在缩小屏幕时不会完全显示

我如何确保第二个屏幕的高度能够显示所有内容？我在类

imageWrapper

中尝试了

overflow:scroll

和

overflow:visible

，但它没有解决我的问题。这是我想要达到的目标

Html和css代码：

.imageWrapper{
身高：100%；
宽度：100%；
位置：相对位置；
溢出：自动；
}
.formShape{
位置：绝对位置；
身高：100%；
排名：0；
右：0；
}
.表格{
位置：绝对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
显示：无；
边缘底部：80px；
宽度：540px；
高度：650px；
背景：#fff；
边界半径：5px；
溢出：隐藏；
z指数：1；
}

内容1
...

我查看了布局并对其进行了编码-我做了以下更改

将图像作为背景图像添加到

.imagewrapper

类中

删除表单shape div并将表单用作形状-如果需要，可以向表单添加背景图像

这就是你要找的吗

（我添加的边框仅供参考-可以删除）

.imageWrapper{
边框：2倍纯红；
背景：url（'https://source.unsplash.com/random');
高度：100vh；
职位：相对
}
.内容{
边框：2件纯蓝；
}
.表格{
边框：2倍纯绿；
位置：绝对位置；
最高：50%；
左：50%；
转换：翻译（-50%，-50%）；
背景：白色；
z指数：1；
身高：90%；
宽度：90%；
边界半径：50px；
}

内容1

您是否尝试过该div的scrollable:true css属性您的code@MohammadFahadRao是的，我尝试了

overflow:scroll

和

overflow:visible

但是他们没有回答我的问题。你能给我们看一张你试图构建的布局图吗？现在你的代码…