IE 在 Visual Studio 和服务器上的调试之间显示不同的页面答案

【问题标题】：IE displays page differently between debug in visual studio and on the serverIE 在 Visual Studio 和服务器上的调试之间显示不同的页面
【发布时间】：2010-09-23 01:20:11
【问题描述】：

这是this问题的延续。

我有一个 ASP.NET 应用程序，当在 IE8 中查看 DEBUG 与显示已发布的 TEST 服务器位置时，该应用程序的某些部分显示不同。

当我在 Debug（通过 VS 2010）中查看页面时，我看到：

但是，当我发布到服务器并直接查看时，它看起来像这样：

标题框只有文本背景颜色为黑色，而不是整个部分。

这是 CSS：

.imageBox
{
    position: relative;
    float: left;
    border-style: solid;
    border-width: 1px;
    text-align: center;
}

.imageBoxTitle
{
    width: 100%;
    background-color: #333333;
    padding: 5px;
}

.imageBoxTitleLbl
{
    font-family: Verdana;
    font-weight: bold;
    font-size: small;
    color: White;
}

这是生成的 HTML

 <div class="imageBox">
    <div class="imageBoxTitle">
        <span id="MainContent_ImagesPanel_ImageHolder1_ImageBoxTitleLabel" class="imageBoxTitleLbl">ITEM OVERVIEW</span>
    </div>

    <div class="imagePlaceHolder">
        <p class=".centeredImage"><a id="MainContent_ImagesPanel_ImageHolder1_ImageHyperLink" href="UserImages/nu5t3hhs.jpg" target="_blank"><img src="UserImages/nu5t3hhs.jpg" height="200" width="200" /></a></p>
        <span id="MainContent_ImagesPanel_ImageHolder1_CustomValidator1" style="color:Red;visibility:hidden;">*</span>
    </div>

    <div class="imageAction">  
    </div>
</div>

所以我在想这可能是某种缓存问题。但是，如果我对 CSS 进行轻微更改（例如更改背景颜色），它会拾取并显示它。此外，我还为 css 文件的查询字符串添加了一个动态生成的 GUID，因此它们永远不会被缓存。 Fiddler 确认它们也没有被缓存。

通过 Visual Studio Debug 查看与直接从服务器访问页面时，IE 呈现 HTML/CSS 的方式似乎不同。

什么事情可能会导致这种行为？

更新：当我在已发布服务器上的 Chrome 或 Firefox 中查看该页面时，它显示正确。我已经清除了 IE 缓存（ctrl-f5），从服务器上删除了 .css 并重新加载，等等。

【问题讨论】：

IE 缓存？尝试使用 Ctrl + F5 刷新，guid 可能不够。你确定，这是好的 css 文件吗？也许您没有将更新的 css 放在服务器上（我想确定一下，因为大多数时候这些问题很容易解决）
我试过 CTRL-F5，我已经从服务器上删除了 .css 文件，我在 Fiddler 中看到它在检索时返回 200。我已经清除了 IE 缓存。如果我在 Chrome 中查看它，它会正确显示。
你确定那是完整的 sn-p，因为那是无效的 HTML - 缺少结束 </div 之一。还有，图片在哪里？
我只添加了关于标题的位。我会将整个部分添加到问题中

标签： html css

【解决方案1】：

当 IE 在 localhost 上呈现时，它将使用 标准兼容模式。

但是，当它在 Intranet 上呈现时，它将使用兼容模式。

不要问我为什么要这样做，这只是 MS 中的一件，目的是为我们的开发人员的生活增添趣味。

只需将其添加到您的标题中即可强制 IE 进入标准兼容模式：

<meta http-equiv="X-UA-Compatible" content="IE=edge" />

享受:)

【讨论】：

【解决方案2】：

感谢 JungleFreak 提供完整的 answer

IE8 以不同的模式运行，具体取决于它访问的是在本地主机上运行的站点还是在另一台服务器上运行的站点。这很奇怪，我知道。我以前也遇到过这个问题。使用开发者工具 (F12) 并检查浏览器运行的模式（Quirks、IE7 标准、IE8 标准、IE8 兼容性）。

【讨论】：