无法格式化JQuery DataTable页面长度和搜索框

Question

我遇到了＆＃34;页面长度＆＃34;出现在3行而不是1行：

如果可能的话，我想得到＆＃34;显示......条目＆＃34;和数据表上方一行上的搜索框，以减少页面空间。所以这样的事情（抱歉＆＃34;油漆＆＃34;工作）：

有没有人知道如何通过CSS做到这一点？如果我不必在每个有数据表的页面上使用Javascript，那就太好了。

谢谢， 特洛伊

更新了代码：

@Imports DRGMITGDataCommon
@Imports DRGMITGWeb
@ModelType IEnumerable(Of DRGMITGDataCommon.LocationDto)

@Code
    ViewData("Title") = "Location Index"
    Layout = "~/Views/Shared/_Layout.vbhtml"

    Dim LocationTypes = LookupValuesHelper.LocationTypes
    Dim Regions = LookupValuesHelper.Districts
    Dim TownNames = LookupValuesHelper.TownNames
    Dim Results = TryCast(ViewBag.Results, List(Of LocationDto))
End Code

<div style="text-align:left; width:280px">
    <h2 class="float-left" style="margin-top: 0px">Locations</h2>
    @If DRGMApplication.UserIsAdmin Then
        @<button title="Create New Location" onclick="location.href='@Url.Action("Create","Location")'" class ="loading" style= "display:inline-block; float: right; margin:auto" ><span class="glyphicon glyphicon-star" style="margin-right:5px" ></span>New Location</button>
    End If  
</div>

<div class="pull-right">
    @If Results.Count() > Model.Count() Then
        @<p>Showing @Model.Count() Of @ViewBag.Results.Count() Total Data Records</p>
    Else
        @<p>@(Model.Count()) Results Found</p>
    End If
</div>

<div style="margin-right:5px">

<table id="MainTable" class="display" cellpadding="0" cellspacing="0">
    <thead valign="bottom" style="font-size:12px">
        <tr>
            <th width="5%">Loc Id</th>
            <th width="5%">RC</th>
            <th width="10%">Town</th>
            <th width="10%">Type & #</th>
            <th width="10%">House #</th>
            <th width="14%">Street Address</th>
            <th width="10%">Quad</th>
            <th width="20%">Location Desc</th>
            <th width="16%"></th>
        </tr>
    </thead>
    <tbody>
    @For Each item In Model
        Dim currentItem = item
        Dim MapLink As String
        If Not String.IsNullOrWhiteSpace(currentItem.Maplink) Then
            MapLink = item.MapLink.Replace("#","")
        End If
        If currentItem.TownId IsNot Nothing Then
            currentItem.TownName = TownNames.Where(Function(t) t.Id = currentItem.TownId).FirstOrDefault()
            currentItem.TownName.District = Regions.Where(Function(t) t.Id = item.TownName.DistrictId).FirstOrDefault()
        Else 
            item.TownName = New TownNameDto With {.District = New DistrictDto With {.Code = "Not Listed"} }
        End If
        currentItem.LocationType = LocationTypes.Where(Function(t) t.Id = item.LocationTypeId).FirstOrDefault() 
        Dim stationId = String.Concat(currentItem.LocationType.Value, " ", currentItem.ValveID, currentItem.DRSNumber, " ", currentItem.ValveLocation)

    @<tr>
        <td><div style="max-width:50px">
            @If String.IsNullOrWhiteSpace(MapLink) = False Then
                @<a title="Open Map" href="@MapLink" target="_new" class="glyphicon glyphicon-globe" style="text-decoration: none"></a>
            End If
            @Html.DisplayFor(Function(modelItem) currentItem.Id)</div>
        </td>
        <td><div style="max-width:50px">@currentItem.TownName.District.Code</div></td>
        <td>@currentItem.TownName.Name</td>
        <td>@stationId</td>
        <td>@currentItem.HouseNumber</td>
        <td>@currentItem.StreetAddress</td>
        <td>@currentItem.Quadrant</td>
        <td>@Html.DisplayFor(Function(modelItem) currentItem.LocationDesc)</td>
        <td>
            <div style="text-align:left">
                @If DRGMApplication.UserIsAdmin Then
                    @<button title="Edit Location" onclick="location.href='@Url.Action("Edit","Location", New With {.id = currentItem.Id})'" class ="loading" style= "display:inline-block; margin:auto" ><span class="glyphicon glyphicon-edit" style="margin-right:1px" ></span></button>
                End If  
                <button title="New Visit" onclick="location.href='@Url.Action("Create", "Visit", New With {.locId = currentItem.Id})'" class ="loading" style= "display:inline-block; margin:auto" ><span class="glyphicon glyphicon-plus" ></span></button>
                @If item.HasVisits  Then
                    @<button title="Previous Visits" onclick="location.href='@Url.Action("LocationVisits","Visit", New With {.locId = currentItem.Id})'" class ="loading" style= "display:inline-block; margin:auto" ><span class="glyphicon glyphicon-search" ></span></button>
                End If
            </div>        
        </td>
    </tr>
    Next
    </tbody>
</table>
</div>

我根本不感动的CSS，我不相信。这是元素的jquery.dataTables.css：

.dataTables_wrapper .dataTables_length {
  float: left;
}
.dataTables_wrapper .dataTables_filter {
  float: right;
  text-align: right;
}
.dataTables_wrapper .dataTables_filter input {
  margin-left: 0.5em;
}