Всплывающий календарь выглядит неправильно - PullRequest
Новая
       76

Всплывающий календарь выглядит неправильно

0 голосов
/ 23 октября 2019

Я пытаюсь реализовать элемент управления CalendarExtension AjaxControlToolkit (19.1.0) в проекте Webforms. VS 2017.

У меня есть инструментарий, на который есть ссылки на главной странице, а также менеджер сценариев. Моя страница содержимого имеет ссылку на scriptmanagerproxy.

В результате на дисплее отображается текущий месяц в верхней строке, вертикальный столбец сокращений дня с левой стороны, без номеров дня для месяца и текущей даты в нижней части. Таким образом, квадратное поле с Месяцем в верхней строке, текущей датой «Сегодня:» в нижней части и левой стороной с сокращением названия дня. В противном случае пустое поле.

(мне кажется, я не могу правильно отформатировать это в этом текстовом поле, чтобы опубликовать то, на что оно похоже)

|<Октябрь 2019 г.> |

| Су || Мо || Ту || Мы || Th || Пт || Sa ||29 ||Сегодня: 23 октября 2019 года |

Мы находимся в США, культурные параметры не установлены. На другой странице (без использования главной страницы) это выглядит нормально (как обычный календарь).

Известна ли проблема с использованием этого на странице содержимого? Есть ли какие-то настройки, неясные или иные, которые я пропускаю?

Я просмотрел кучу онлайн-статей о контроле, но ничего не упомянул что-то подобное.

Мой код aspxреализуя его: 

…
<tr>
  <td>
    <asp:Label ID="Label6" runat="server" Text="Start Date"></asp:Label>
    <asp:TextBox ID="txtbxStartDate" runat="server" />
    <ajaxToolkit:CalendarExtender ID="CalendarExtender1" TargetControlID="txtbxStartDate" runat="server" />
  </td>
</tr>
…

1 Ответ

0 голосов
/ 24 октября 2019

Решение: с помощью моего дизайнера мы выяснили, что проблема заключалась в том, что таблица стилей css главной страницы переопределяла классы 'td' и другие классы css, и поэтому каждому элементу было присвоено значение width: 100%.

Добавив следующий код стиля на веб-страницу, мы решили проблему. 

.ajax__calendar_container td {
    width: auto;
}
...