Есть много способов решить эту проблему. Как вы можете подтвердить описанный способ here, но в других текстах есть шрифт 11px
, который вы не хотите.
Проблема со шрифтом является настройка CSS (см here)
.ui-widget .ui-widget { font-size: 1em; }
Так как Tab и jqGrid имеют класс "ui-widget"
параметр перезаписывает настройки шрифта из jqGrid.css (см here):
.ui-jqgrid {position: relative; font-size:11px;}
в результате у вас есть картина, как на the demo:
jQuery UI использует em
стиль. Таким образом, вы можете, например, включить в CSS вашей страницы следующий
html, body { font-size: 75% }
(см here). В случае, если вы будете иметь следующие результаты (см the demo):
Кстати документация jqGrid предложить косвенно (см пример HTML страницы here). Я понимаю, что это могут быть ситуации, когда вы хотите, не изменять размер других шрифтов на странице.
В случае, если вы можете использовать, например
.ui-jqgrid { font-size: 11px !important; }
или в качестве альтернативы следующие
.ui-jqgrid .ui-jqgrid-view { font-size: 11px; }
.ui-jqgrid .ui-jqgrid-pager { font-size: 11px; }
.ui-jqgrid .loading { font-size: 11px; }
Результаты подхода вы можете увидеть на the next demo:
Если я понимаю, что вы это исправите результаты, которые вы хотите получить.
ОБНОВЛЕНО: Если вы используете инструменты разработчика хромовых вы можете увидеть ту же информацию, как и в IE Developer Tools, чтобы найти стиль CSS, который перепишет font-size
из jqGrid. Например, в my first demo вы увидите
Так что если в вашем приложении мои приведенные выше рекомендации не работают, вы должны изучить эффективные стили CSS aplied к любой ячейке сетки и выяснить, какие CSS настройки перезапись CSS в jqGrid.
ОБНОВЛЕНО 2: От ссылки, которую вы посылаете меня по электронной почте я мог видеть, что проблема существует, потому что вы забыли включить любую <!DOCTYPE html ...>
декларации до <html>
. Таким образом, веб-браузер интерпретирует вашу страницу как очень старый стиль HTML, написанный в то время, пока не был опубликован даже HTML 3.2 (до 1997 года). Это так называется Quirks mode.
Чтобы решить эту проблему, вы должны включать в себя, прежде чем <html>
линии как
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
или просто
<!DOCTYPE html>
(стандарт HTML5). Более того, я строго рекомендую вам проверять свои HTML-страницы в каком-то HTML-варирадоре, например http://validator.w3.org/. Текущий код - это сочетание между HTML и XHTML, что не очень хорошо.
ОБНОВЛЕНИЕ 2: Я отправил дополнительно the feature request где я предложить, чтобы остановить создание jqGrid в случае document.documentMode <= 5
, так что в случае использования Quirks mode (не <!DOCTYPE html ...>
).
ОБНОВЛЕНО 3: На основе вопрос/ответ я отправил два предложения trirand: this и this. Оба предложения были приняты и теперь являются частями jqGrid (см. here и here). Поэтому у пользователя следующей версии не должно быть описанной проблемы.
Это именно то, что я ищу. Но когда я попробовал '.ui-jqgrid {position: relative; font-size: 11px! important;} 'он просто изменил размер шрифта заголовка. Данные в таблице, а также на панели навигации оставались большими. Я попробовал ваше альтернативное предложение, и это тоже не сработало. – Dave
@Dave: Причина может быть только ** еще одним CSS **, который вы используете. Просто откройте IE Developer Tools с помощью F12. Выберите вкладку «HTML». Нажмите «Обновить» (F5), чтобы загрузить данные страницы. Нажмите Ctrl-B или используйте меню «Поиск», а затем выберите любую ячейку сетки. В правой части прокрутите стили и найдите стиль CSS, где 'font-size' все еще активен. Это CSS, который делает проблему в вашем случае. В моей демонстрации это будет '.ui-widget .ui-widget {font-size: 1em; } ', как я описал в своем ответе. – Oleg
Это я понимаю. Я не могу понять, как переопределить это значение только для jqGrid, но для всего jqGrid. Ваш ответ об использовании '! Important' отлично работает в вашем третьем примере, и именно это я и ищу. Но когда я это делаю, он только форматирует заголовок таблицы с правильным размером шрифта. – Dave