网站上出现不需要的框阴影和响应中断答案

【问题标题】：Unwanted box shadow appearing on website and responsive break网站上出现不需要的框阴影和响应中断
【发布时间】：2017-12-06 23:48:21
【问题描述】：

我目前正在更新/处理此网页“https://www.emergencydentalservice.com/emergency-dentist-by-city”，它们是出现在正文中的不需要的框阴影，我无法确定从哪里或为什么。除了不需要的阴影之外，该站点似乎在 768px 之后也中断了，我不知道为什么。任何帮助将不胜感激，谢谢大家。 Image of the site breaking after 768px

【问题讨论】：

您需要更具体地了解您的问题。任何人都很难回答你的问题。可能有很多东西。

标签： html css responsive-design responsive box-shadow

【解决方案1】：

您在eds_main.css 上设置了一个框阴影为#inside-main。

#inside-main {
    width: 100%;
    background: #fff;
    margin: 0 auto;
    box-shadow: 1px -2px 4px #666;
    -webkit-box-shadow: 1px -2px 4px #666;
    -moz-box-shadow: 1px -2px 4px #666;
    -o-box-shadow: 1px -2px 4px #666;
}

变成

#inside-main {
    width: 100%;
    background: #fff;
    margin: 0 auto;
}

至于布局中断，您将eds_main.css 上的#foot-de-eds, #foot-top-cites 设置为：

#foot-de-eds, #foot-top-cites {
    margin: 1.3em auto;
    width: 100%;
    max-width: 1028px;
    padding-left: 2em;
}

尝试删除max-width: 1028px; - 所以：

#foot-de-eds, #foot-top-cites {
    margin: 1.3em auto;
    width: 100%;
    padding-left: 2em;
}

【讨论】：

【解决方案2】：

对于阴影问题： #inside-main 仍然有来自 eds_main.css 的 box-shadow 属性。

虽然你并没有真正指定你想要和不想要哪些阴影......因为页面上有多个。

检查元素/开发工具是你的朋友。可以轻松找到您可能忽略的属性。

【讨论】：

【解决方案3】：

在<div class="phone-wrap">

删除

background: url(/eds_siteIMGS/phoneBG_seperated.png) repeat-x;

图像有阴影

【讨论】：