图像无法根据我的屏幕进行修剪

Question

我希望图像是可见的，但我放置了位置：绝对和右侧：-300px，只是为了显示图像的一部分。我不想为了显示我的图像而向右滚动，只想把它剪掉。我尝试过溢出：隐藏，但不起作用。

这里是代码笔链接：https://codepen.io/bogdan-pavel/pen/xxOzeOd

所以，我说的是右边的图片。

<div id="image">
<img src="https://i.ibb.co/3hRJLTK/creata.png" alt="fata creata" style="width:800px; position:absolute; right:-300px;" /> 
</div>

Answer 1

在body上添加overflow-x: hidden;

body{
overflow-x: hidden;
}

Answer 2

您需要使容器的位置相对，并隐藏溢出。

#allcontent {
position: relative;
overflow: hidden;
}