Управление календарем asp.net появляется под текстовым полем

Question

Я использую кнопку изображения для отображения календаря asp.net (этот элемент управления поставляется с VS 2008). Однако, когда я нажимаю кнопку изображения, элементы управления календарем отображаются «ниже» текстового поля, которое оно поддерживает, чтобы заполнить. Как я могу заставить элемент управления появиться в правой части текстового поля?

Мой код:

      <asp:ImageButton ID="imgCalendar" runat="server" Height="17px" 
         ImageUrl="~/Images/CAL.gif" 
         onclick="imgCalendar_Click1" Width="19px" 
         Visible="true" ImageAlign="Middle" /> 
        <asp:Panel ID="Panel1" runat="server"> 
         <asp:Calendar ID="calStartDate" runat="server" BackColor="Transparent" 
          BorderColor="#FFCC66" BorderWidth="1px" DayHeaderStyle-BackColor="gainsboro" 
          DayNameFormat="Shortest" FirstDayOfWeek="Monday" Font-Bold="True" 
          Font-Names="Verdana" Font-Size="8pt" ForeColor="Gray" Height="102px" 
          OnSelectionChanged="calStartDate_SelectionChanged" 
          OtherMonthDayStyle-ForeColor="gray" SelectedDayStyle-BackColor="Navy" 
          SelectedDayStyle-Font-Bold="True" SelectorStyle-BackColor="gainsboro" 
          ShowGridLines="True" TitleStyle-BackColor="gray" TitleStyle-Font-Bold="True" 
          TitleStyle-Font-Size="12px" TodayDayStyle-BackColor="gainsboro" Visible="False" Width="62px"> 
          <SelectedDayStyle BackColor="#404040" Font-Bold="True" /> 
          <TodayDayStyle BackColor="#3A080B" ForeColor="White" /> 
          <SelectorStyle BackColor="#FFCC66" /> 
          <OtherMonthDayStyle ForeColor="#CC9966" /> 
          <NextPrevStyle Font-Size="9pt" ForeColor="#3A080B" /> 
          <DayHeaderStyle BackColor="#3A080B" Font-Bold="True" Height="1px" ForeColor="White" /> 
          <TitleStyle BackColor="#E0C16B" Font-Bold="True" Font-Size="9pt" ForeColor="#3A080B" /> 
         </asp:Calendar> 
        </asp:Panel> 

Answer 1

Off верхней части моей головы, я предлагаю, чтобы вы установили CssClass свойство asp:Panel и расположите его с помощью CSS. HTML, сгенерированный элементом управления, вероятно, отображает элементы уровня блока (скорее всего, <div> или <table>), что приведет к его отображению по новой строке по умолчанию.

Попробуйте использовать display: inline или display: inline-block или используя float, чтобы разместить его.

В зависимости от того, как вы ввели свое текстовое поле, вам может потребоваться изменить его стили, чтобы разместить расположение календаря.

Answer 2

Добавить style = "float: right" в текстовое поле.