JQGRID - Make checkboxes fit row height

Question

In JQGRID, I increased the row size of my table by doing this in the CSS file:

.ui-jqgrid tr.jqgrow td input { padding: 0px; height: 60px;}

Since I have multiselect: true, how can I make the checkboxes to auto-fit the row size on all the grid (including header)?

I tried this answer which is working for the header but not able to reproduce it for the rest of the grid: How to increase jqgrid header checkbox size

So far they are way to small...

Thanks

Which is the version of jqGrid used? – Tony Tomov Aug 14 '23 at 07:16 — Tony Tomov, Aug 14 '23 at 07:16
jQuery UI - v1.11.2 - 2014-10-16 – Nico44044 Aug 17 '23 at 13:24 — Nico44044, Aug 17 '23 at 13:24
I ask for jqGrid version, not for jQuery or jQuery UI. – Tony Tomov Aug 17 '23 at 18:20 — Tony Tomov, Aug 17 '23 at 18:20

jcarrera · Answer 1 · 2023-08-17T18:11:33.183

1

Try adding these styles to the checkboxes, you can do it after creating the grid this way:

$("td input[type='checkbox']").css("height","100%").css("width","100%");

edited Aug 17 '23 at 18:11

answered Aug 14 '23 at 16:26

jcarrera

In wich part of the code please ? – Nico44044 Aug 17 '23 at 17:18
it's working on safari iOs , Firefox and Edge but NOT on safari for mac ... I emptied the cache and the cookies but still not working. Any Idea ? It's strange because the checkboxes are huge on iOs and Edge but just a little bigger on firefox . Do you know how to make them the same on all browsers ? – Nico44044 Aug 17 '23 at 21:08

score 1 · Accepted Answer · answered Aug 19 '23 at 11:36

1

Thanks to jcarrera's answer, I finally made it by doing this with css (working with all browsers so far) :

input[type="checkbox"] {
        -webkit-transform: scale(2, 2);
    }

answered Aug 19 '23 at 11:36

Nico44044

2 Answers2