Html 停止宽图像生成水平滚动条

在一个网页上，我有一个宽的图像，它应该占据屏幕的50%。它看起来像我想要的，但它会产生一个不需要的水平滚动条。我不希望图像缩小，我希望它保持原样，但不产生水平滚动条。我怎么能这样做

HTML:

编辑：我有一些建议，我删除溢出选项。这不起作用，所以我修改了代码（将图像放在html中），但仍然不起作用。以下是CSSDesk链接：

---

在CSS中使用此选项隐藏CSS类图像的滚动条：

.image {
    position:absolute;
    left:50%;
    background-image: url('Images/banneriPhone.png');
    width:774px;
    height:759px;
    overflow-x:hidden;
    overflow-y:hidden;
}

overflow-x

将隐藏水平滚动条

overflow-y

将隐藏垂直滚动条

---

---

编辑：在这里您可以看到溢出属性的一些示例：

对元素应用以下css规则：

box-sizing: border-box;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;

并设置您的利润：

margin:0;

---

由于框大小规则，填充可以保持不变（填充不包括在图像的宽度中，可能设置为100%）。

要删除图像上的滚动条，我执行了以下操作，效果良好。将以下内容添加到CSS上图像所在的类中：

overflow:hidden;

---

这没用。很遗憾，滚动条仍然存在。这个div周围是否有一个div，其最大宽度大于图像div的774px？我用这个CSS制作了一个原型-在我的示例中没有滚动条-您有任何示例可以看到它吗？（不在CSSdesk中，因为只有在您的会话中，当您在CSSdesk中制作一些东西时，它才会出现问题-CSSdesk中有时也会出现问题）

margin:0;

overflow:hidden;