搜索字段顯示出我的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降低了。

嘗試使“客戶列表”標題不那么寬和/或向左浮動，看看會發生什么。