jqGrid: champs d'entrée filterToolbar coupés dans IE 10

Question

Jetez un oeil à l'apparence de mon filterToolbar dans Chrome:

Et maintenant IE 10:

Pourquoi IE couper la barre d'outils comme ça? Il semble encore pire en mode de compatibilité. J'ai essayé des méthodes de couple de modifier la hauteur de la barre d'outils:

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

^L'ajout de ce fichier dans le Site.css ne semble pas affecter quoi que ce soit.

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

^Cela fonctionne presque; la barre d'outils lui-même est migrés à toute valeur, mais les champs d'entrée sont encore coupé en deux:

Si vous cliquez sur l'un des champs d'entrée, ils sauter quelques pixels pour afficher la chose , mais ce n'est évidemment pas ce que je veux. Et cliquer sur les listes déroulantes de sélection ne les déplace pas du tout.

La page est créée dans ASP.NET Web Forms à l'aide de jqGrid v4.5.2 et de jQuery v1.8.2.

Answer 1

Ce n'est pas la meilleure réponse, mais c'est une réponse. Un de mes amis a recommandé que j'utilise une feuille "reset CSS" pour effacer les styles par défaut du navigateur. J'ai appliqué la feuille trouvée here et cela a plus ou moins résolu ce problème.

Answer 2

Cela se produit généralement lorsque le remplissage est défini sur le td. Par exemple vous avez des css comme ceci:

td { 
    padding: 5px; 
} 

Depuis css jqGrid ne précise pas de rembourrage pour la cellule qui contient les boîtes d'entrée tout comme le sera css ci-dessus effet les cellules. Comme il est recommandé de ne pas modifier le css jqGrid parce que la prochaine fois que vous passez à la prochaine version des mods seront perdues, essayez « remplaçant » (pas remplaçant vraiment) comme si:

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