Forum
11:11
10/08/2009
Hello Tony,
There are some common problem with the font size in case of usage jqGrid inside of other jQuery UI widget. The following
CSS used in jQuery UI CSS ovewrites the CSS setting
used in ui.jqgrid.css.
My suggestion is to replace above line which set font-size for gbox to the following three lines
.ui-jqgrid .ui-jqgrid-pager { font-size: 11px; }
.ui-jqgrid .ui-jqgrid-view { font-size: 11px; }
In the case the results will be the same as before, but the rule .ui-widget .ui-widget { font-size: 1em; } make no problems.
The setting of font-size for .ui-jqdialog already exist separately so one don't need to add it as the 4-th rule.
See demo example and some detailes in the answer.
Best regards
Oleg
18:07
Moderators
30/10/2007
Hello Oleg,
Thank you, but reading this:
http://filamentgroup.com/lab/u.....to_em_con/
and this
http://filamentgroup.com/lab/r....._archived/
I'm not sure that we shuld change the css this way
Regardas
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
18:25
Moderators
30/10/2007
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
18:47
10/08/2009
Tony,
I agree, that the usage of em instead of px would have many advantages. I am afrade that the changes can be not so simple. One have to change many height, margin and padding settings (but not all because in some situations icons with fixed pixel size are used).
My suggesting was about the first small step to improve CSS which uses jqGrid. jqGrid use not only own styles, but also jQuery UI CSS framework. So have have to take in consideration the standard jQuery UI CSS.
The line
from ui.jqgrid.css set font-size on the gbox. On the other side gbox div uses ui-widget ui-widget-content ui-corner-all classes too. Because of usage of ui-widget the above setting of font-size:11px; will be ovewritten by
if jqGrid will be used inside of some jqGrid widget like jQuery UI Tab or Dialog. So one have to implement some kind of fix. The changes in ui.jqgrid.css, which I suggest will solve the problem.
To be exactly ui.jqgrid.css has already the parts with
.ui-jqgrid .ui-jqgrid-pager { ... }
.ui-jqgrid .ui-jqgrid-view { ... }
So I suggest just to remove the setting of font-size:11px; from the
in the parts .ui-jqgrid .loading { ... }, .ui-jqgrid .ui-jqgrid-pager { ... } and .ui-jqgrid .ui-jqgrid-view { ... }.
I thnk that the small chage will make no side effects.
Later one can make more changes in ui.jqgrid.css and replace the most parts with px to em. I would find this very good, but I find it such changes more complex as what I suggested.
Best regards
Oleg
08:45
Moderators
30/10/2007
Oleg,
You are right. Fixed.
Tony
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
Most Users Ever Online: 715
Currently Online:
54 Guest(s)
Currently Browsing this Page:
1 Guest(s)
Top Posters:
OlegK: 1255
markw65: 179
kobruleht: 144
phicarre: 132
YamilBracho: 124
Renso: 118
Member Stats:
Guest Posters: 447
Members: 11373
Moderators: 2
Admins: 1
Forum Stats:
Groups: 1
Forums: 8
Topics: 10592
Posts: 31289
Newest Members:
, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.comModerators: tony: 7721, Rumen[Trirand]: 81
Administrators: admin: 66