css - JQGrid 表头高度

Question

我在 ASP .NET MVC 应用程序中使用 JQGrid。网格本身运行良好。但是，网格(或页面上的第一个网格)的标题高度正在增长以匹配我的左侧导航菜单的高度。这是我拥有的大部分 Site.Master 布局。我只是不明白为什么会这样。

<div class="page">
        <div>
            <div id="left">
                 <div id="leftnavmenu">
                       <%= Html.MvcSiteMap().Menu("MvcSiteMapProvider", "activenav")%>
                </div>

                <div id="leftnav-msg">
                        Message goes here
                </div>
            </div>

            <div id="main">
                <div id="mainsitename">
                    <div id="mainsitenameimage"></div>
                    <div id="mainsitename1">Intake Tool</div>                
                </div> 
                <div id="mainpagetitle">                 
                        <%--<%=Html.MvcSiteMap().SiteMapPath(" &gt; ") %>--%>
                        <asp:ContentPlaceHolder ID="PageTitle" runat="server" />
                </div>

                <asp:ContentPlaceHolder ID="MainContent" runat="server" />

                <div id="maintabledata">
                    <asp:ContentPlaceHolder ID="TableContent" runat="server" />
                </div>

                <div id="footer"></div>
            </div>
        </div>
    </div>

Answer 1

我假设 #left有一个 float:left风格，而#main才不是。这似乎是 jqGrid 的一个错误。有 another post 处理完全相同的问题。

我实际上创建了一个 jsFiddle example 说明了问题。

在另一篇文章中，Oleg 建议您在两个并排的 <div> 上使用 float:left s，在它们之后有另一个带有 clear:both 的 div。这在我的情况下不起作用，因为我希望正确的 div 扩展到浏览器窗口的整个剩余宽度。 float <div> s 必须具有与之关联的显式宽度(如果没有，它们将采用其中最宽元素的宽度)。

一个对我有用的解决方法是设置 float 的高度 <div>小一些(1px)并为该 div 的内容设置一个明确的高度。这在上面的 jsFiddle 中进行了说明。