<a> tag appears in the wrong position in Chrome</a>

Question

我在ASP.NET MVC 5应用程序中有重复的部分视图，在Chrome中的某些情况下显示不正确。它不会发生在任何其他浏览器中，我无法弄清楚发生了什么。

我的剃刀代码非常简单 - 只是一个调用foreach的{​​{1}}循环。为了节省空间，我现在要跳过它，但它产生的HTML看起来像这样：

@Html.Partial()

页面本身看起来像这样：

当用户单击“编辑”链接时，我使用AJAX调用将单个<div id="dataDisplay"> <div id="dataRow39" class="list"> <a href="/StateAssociation/Edit/39" class="x-small action edit-button" data-hba-ajax="true" data-hba-method="get" data-hba-target="#dataRow39" data-hba-mode="replace">Edit</a> <span class="normal">AAA Test 1</span> <span class="large">Test Description 1</span> <a href="/StateAssociation/Delete/39" class="delete-button" data-hba-ajax="true" data-hba-method="get" data-hba-target="#dataRow39" data-hba-mode="replace">X</a> </div> <div id="dataRow1" class="list"> <a href="/StateAssociation/Edit/1" class="x-small action edit-button" data-hba-ajax="true" data-hba-method="get" data-hba-target="#dataRow1" data-hba-mode="replace">Edit</a> <span class="normal">AHBA</span> <span class="large">Arkansas Home Builders Association</span> <a href="/StateAssociation/Delete/1" class="delete-button" data-hba-ajax="true" data-hba-method="get" data-hba-target="#dataRow1" data-hba-mode="replace">X</a> </div> . . . </div> 替换为具有div元素用于数据输入的不同局部视图。 input还有一个取消按钮，可以触发另一个AJAX回调到原始的局部视图。这会产生几乎相同的HTML，但是一个元素定位错误。

div

我能看到的唯一区别是那些空的<div id="dataDisplay"> <div id="dataRow39" class="list"> <a href="/StateAssociation/Edit/39" class="x-small action edit-button" data-hba-ajax="true" data-hba-method="get" data-hba-target="#dataRow39" data-hba-mode="replace" style="">Edit</a> <span class="normal" style="">AAA Test 1</span> <span class="large" style="">Test Description 1</span> <a href="/StateAssociation/Delete/39" class="delete-button" data-hba-ajax="true" data-hba-method="get" data-hba-target="#dataRow39" data-hba-mode="replace" style="">X</a> </div> <div id="dataRow1" class="list"> <a href="/StateAssociation/Edit/1" class="x-small action edit-button" data-hba-ajax="true" data-hba-method="get" data-hba-target="#dataRow1" data-hba-mode="replace">Edit</a> <span class="normal">AHBA</span> <span class="large">Arkansas Home Builders Association</span> <a href="/StateAssociation/Delete/1" class="delete-button" data-hba-ajax="true" data-hba-method="get" data-hba-target="#dataRow1" data-hba-mode="replace">X</a> </div> . . . </div> 标签。当我调试我的AJAX时，它们不会出现在控制台中，并且它们不会出现在其他浏览器中。但如果我手动进入并删除它们，它似乎无法解决布局问题。

我意识到我遗漏了很多细节。我试图阻止它过长。如果需要，我可以提供任何遗漏的细节。有没有人知道会出现什么问题？

更新：当我正在玩这个时，我感觉它与style类上的float:right有关。这是该类的CSS：

.delete-button