Html 绝对div幻灯片。是否合适？

在一个网站中，我希望用户通过幻灯片效果浏览2部分信息，如下面的JSFIDLE所示。我使用绝对定位，因为在网站中，我有故意相互重叠的元素，绝对div很方便，因为它们不会随着网站的流量而改变

这种方法合适吗？我看到许多帖子建议不要在文档中包含绝对div

$（“按钮”）。单击（函数（e）{
$（'#div2'）.addClass（'slide'）；
});
html，正文{
保证金：0；
填充：0；
溢出x：隐藏；
}
梅因先生{
位置：相对位置；
高度：100vh；
宽度：50%；
背景：红色；
}
#第一组{
位置：绝对位置；
排名：0；
底部：0；
右：0；
宽度：50%；
背景：绿色；
}
#第二组{
位置：绝对位置；
右：0；
排名：0；
底部：0；
背景：蓝色；
宽度：50%；
转化：translateX（100%）；
过渡时间：1000ms；
}
#第2部分：幻灯片{
变换：translateX（0）；
}

更多内容
内容1。。。。。
内容2。。。。
这种方法合适吗？-我认为对这样一个问题的回答主要是基于观点的，这是离题的。你能把这句话说得更具体、更客观吗？有什么特别的问题是你想要避免的吗？如果我想知道当屏幕调整大小时是否会有危险，或者一个专业的专家会这样做还是用另一种方法。。