Тематика jQuery-UI - различия в размерах CSS - PullRequest
Новая
       32

Тематика jQuery-UI - различия в размерах CSS

3 голосов
/ 18 марта 2009

При использовании образцов jQueryUI на сайте ( браузер тем ) все выглядит отлично. Но когда я добавляю код и тему в свое приложение, размер становится неуместным (я пытаюсь использовать тему Редмонда).

Есть идеи, почему эти образцы выглядят такими разными? В приложении, которое я создал, есть только одна ссылка CSS, предназначенная для темы Redmond ... Эти изображения в точности соответствуют их отображению в браузере.

Моя заявка:
альтернативный текст http://www.imageunload.com/public/14462/jQueryUI.png

JQuery UI Пример:
альтернативный текст http://www.imageunload.com/public/14463/jQueryUI-Sample.png

Код моей заявки: 

<div>
    <asp:TextBox ID="txtDateSample" runat="server"></asp:TextBox>
</div>
</form>
<script type="text/javascript" language="javascript">
    $(function() {
        $('#<%= txtDateSample.ClientID %>').datepicker({
            showButtonPanel: true,
            showOn: 'button',
            buttonImage: '../Graphics/Icons/calendar.png',
            buttonImageOnly: true
        });
    });
</script>

Firebug Вид Div: 

<div id="ui-datepicker-div" class="ui-datepicker ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-helper-hidden-accessible"/>

Ответы [ 3 ]

6 голосов
/ 18 марта 2009

Это случалось со мной. Это потому, что некоторые из ваших стилей непреднамеренно влияют на календарь div. Получить Firebug и проверить, какие стили применяются к календарю. Затем отредактируйте тему, чтобы переопределить все, что делают ваши стили.

EDIT:

Часть, которую вы ищете, это не сгенерированный HTML, хотя это важно, это больше того, какие стили на самом деле применяются:

Firebug Style Tab
(источник: pathf.com )

Вы увидите стили, которые применяются, а стили, которые были назначены, но не применяются, будут показаны вычеркнуто . Вы, вероятно, увидите некоторые из ваших стилей в этом окне. Они, скорее всего, виновник. Исправьте их, сделав их более конкретными, и ваш календарь должен быть в порядке.

1 голос
/ 12 июня 2013

добавьте этот код на страницу index.php, домашнюю страницу или каждую страницу 

<head>
<style>
    body{
        font-size: 62.5%; /* it is necessary for jquery ui */
        }
</style>
</head>

это законная процедура кодирования для управления размерами шрифтов или тегов при использовании jquery-ui.

1 голос
/ 19 марта 2009

Когда вещи меньше, чем вы ожидаете, хорошим предположением будет то, что некоторый процент / пропорциональный размер происходит рекурсивно, то есть, что у вас есть 

.foo {width: 80%;}

где-то, и это было применено дважды или более, что означает, что ваша ширина заканчивается на 80% от 80% от 80%.

...