精灵渲染不正确

Question

我有一个带有背景图像（精灵）按钮的页面。当我没有把我的精灵放在一张桌子上时，我会在网络浏览器上对角地散布重复的图像，而没有画廊。在HTML源代码视图中，一切看起来都很好，但是如果我去了Inspector，它看起来会有所不同，重复我从右到左对角创建的按钮。

更新

我刚才意识到另一种让这种方式发挥作用的方法是改变：

<a href="../Gallery/Create" class="l_new" />

到

<a href="../Gallery/Create" class="l_new" ></a>

这不是困难。我能想到的唯一一件事就是我的@renderbody版本中的一些错误必须与_layout.chtml一起使用（我使用visual studio生成的版本）。

看起来这将继续成为一个谜，但为了以防万一，我会发布我的问题。

l_new样式包含精灵信息：

.l_new
{
width: 170px;
height: 36px;
background-position: -43px -155px;
background-image: url('img/sprites.png?v=6');
background-repeat: no-repeat;
overflow: hidden;
display:block;
}

我找不到任何关于HTML的异常，除了它是在我以前从未使用过的部分标签中的事实，我没有看到任何javascripts在运行。

如果我将精灵包含在表格中，一切正常。

以下是Chrome的检查员的样子。它在IE9中做同样的事情。我没有发布HTML源代码，但请相信我这完全正常，并不反映下面的输出。

以下是index.chtml文件的示例，该文件导致问题：

@model List<AutoShow_MVC.Models.GalleryModel>
@using AutoShow_MVC.Models

@{
    ViewBag.Title = "Index";
}

<h2>Photo Gallery</h2>

<a href="../Gallery/Create" class="l_new" />