Question

我的侧边车有问题，我确定我的CSS不正确，所以也许你可以帮我搞清楚。

我在页面上有一个背景图片，一个全宽横幅。但是当我打开侧面推车时，图像会越过它。它涵盖了侧车内的内容。

这是页面：http://innovo-medical.com/pages/about-innovo-medical

点击购物车打开侧面购物车并查看问题

HTML就是

CSS：

public ActionResult Details(int id)
{
   var vm = new StudentDetailVm { Id = id,
                                 Value = new StudentVm { 
                                                        StudentName = "Scott", 
                                                        Age = 23}};
  return View(vm);
}

请尽可能帮我识别错误！

非常感谢你！

Answer 1

您可以删除border-top，还有一个容器width，如果您希望图片全屏水平，请不要在图片中使用。

width: 1200px

图像全宽技术

#header-image {
    background-attachment: fixed;
    background-image: url("//cdn.shopify.com/s/files/1/0641/4457/t/3/assets/Ladyinblue%20Copy.jpg?12631246775371885148");
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 450px;
    margin: 0 0 10px -3999px;
    position: relative;
}

注意：而不是复制代码，尝试理解它

Answer 2

这是我到目前为止所发现的：

在谷歌浏览器47中，我向overflow:hidden;添加了一个样式<div class="nm-page">，它就像你提到的那样有效;
在Firefox 40中，即使添加相同的样式，点击“购物车”也不会显示您的购物车;
在Firefox 24和Chrome 34中，它按原样运行。

横幅图片涵盖电子商务故事中的侧面推车。怎么预防这个？

2 个答案: