搜索字段显示出我的ASP.NET MVC Web应用程序内部的布局问题

Question

我的剃刀视图中包含以下内容：-

<div style="float:right">
@using (Ajax.BeginForm(
new AjaxOptions
{
    HttpMethod = "get",
    InsertionMode = InsertionMode.Replace,
    LoadingElementId = "progress",
    UpdateTargetId = "customerTable"
}))
{
<text>Search</text>  <input placeholder="Search by name.." name="searchTerm" type="text" data-autocomplete-source= "@Url.Action("AutoComplete", "Customer")" /> 
<input class="btn btn-success" type="submit" value="search" />
<img src="~/Content/Ajax-loader-bar.gif" class="loadingimage" id="progress" />
}
</div>  
<div id="customerTable">
@Html.Partial("_CustomerTable", Model)
</div>

布局将在IE和chrome上很好地显示，但是在firefox上布局将不正确，如下所示：-

那么，什么可能导致此布局错误？

Answer 1

与其说它是CSS错误，不如说是“布局”错误。 我猜想您没有在“客户列表”区域中浮动，或者它太宽了，因为没有空间，导致包含表单的div降低了。

尝试使“客户列表”标题不那么宽和/或向左浮动，看看会发生什么。