Css 保持精确宽度的固定位置图像+；高度和位置

我可以让它在一定程度上工作，但不是100%的方式，我想要的。所以，如果有人能帮我把这件事做好，我将不胜感激

我有一个Wordpress网站，宽度为1060px。我已经创建了一个DIV，其中包含

标记前面的图像。我希望此图像位于站点容器左侧之外。我已经创建了这个使用位置：相对；CSS。但是，我想做的是让这个元素有一个位置：固定；属性，以便在滚动时保持其在屏幕上的位置。同样，我可以在CSS中创建它。我可以在1920x1080屏幕上看到我想要的一切，但当我在2304x1440屏幕上查看时，图像的位置会远离站点容器，效果会消失

这里是一个HTML和CSS的例子，我用它在1920x1080屏幕上获得了正确的效果

HTML

我所追求的是一种在屏幕上以固定位置保持图像静止的方法，它可以在所有屏幕尺寸上接触到我的站点容器的边缘

---

有人能推荐一些CSS来创建我想要的效果吗？

当屏幕大小达到1080px时，您可以使用@media来更改主体，添加图像。调整右下窗格的大小以查看效果

CSS

<div class="left-container-wrapper">
<div class="left-container"><img src="image-url.jpg" width="100%"         /></div>
</div>

.left-container-wrapper {
width: 50%; /* Get it to be half the screen width */
.left-container{
float: right; /* To force it to the right edge of the parent container     which is exactly half the screen width */
position: fixed;
left: 530px; /* Half the width of the site container */
}

@media screen and (min-width: 1080px) {
body {
    background-image: url("https://s.w-x.co/twcn_TWC_FacebookVideo_825x130_opt3.jpg");
    background-repeat: no-repeat;
    background-position: left top;
    background-attachment: fixed;
    }
}

#content {
  margin: 50px 100px;
}