jquery - jqGrid：在 IE 10 中截断的 filterToolbar 输入字段

Question

看看我的 filterToolbar 在 Chrome 中的外观：

现在 IE 10：

为什么IE会这样切断工具栏？在兼容模式下看起来更糟。我尝试了几种更改工具栏高度的方法：

.ui-jqgrid table.ui-jqgrid-htable th.ui-th-column input, .ui-jqgrid table.ui-jqgrid-htable th.ui-th-column select { height: 200px; }

^ 在 Site.css 文件中添加它似乎没有任何影响。

var $toolbar = $("tr.ui-search-toolbar", grid[0].grid.hDiv); $toolbar.height(200); // test size of 200

^ 这几乎可行；工具栏本身被放大到任何值，但输入字段仍然减半：

如果您然后单击任何输入字段，它们会跳跃几个像素以显示整个内容，但这显然不是我想要的。并且单击选择下拉菜单根本不会移动它们。

该页面使用 jqGrid v4.5.2 和 jQuery v1.8.2 在 ASP.NET Web 窗体中构建。

Answer 1

当您在 td 上设置了填充时，通常会发生这种情况。例如，您有一些这样的 css：

td {
    padding: 5px;
}

由于 jqGrid 的 css 没有为包含输入框的单元格指定填充，任何像上面这样的 css 都会影响单元格。由于不建议修改 jqGrid 的 css，因为下次升级到下一个版本时，任何 mod 都将丢失，请尝试“覆盖”（不是真正覆盖）它，如下所示：

.ui-jqgrid .ui-search-table td {
    padding: 0px;
}

Answer 2

这不是最好的答案，但它是一个答案。我的一个朋友建议我使用“重置 CSS”表来清除浏览器的默认样式。我应用了在这里找到的工作表，它或多或少地解决了这个问题。