How to dynamically position a panel

In the below, I would like the Panel, pnlChoice, to show directly after the content in DateTimeLabel2.  The issue that I have is that the content in DateTimeLable2 can vary in length, so I need to somehow dynamically position the panel.

thanks
<asp:UpdatePanel  runat="server" id="UpdatePanel2">           
            <ContentTemplate>
              
            <div style=" border-style:solid; border-width:1px;"><div style=" background-color:#f5f8fa; border-style:solid;
border-color:#f5f8fa;
border-width:30px;">
              <div><asp:Label runat="server"  id="DateTimeLabel2" /></div>
         
                <asp:Panel ID="pnlChoice" runat="server">
                </asp:Panel> <br /></div></div><br />
                  <p style="display:none" id="para">jjj</p>
                <asp:Button runat="server" id="UpdateButton2"   OnClientClick="SendForm()" onclick="UpdateButton_Click" text="Update"  Style="background-image: url(images/imagebutton.png); background-repeat: no-repeat; font-size:medium; color:White" BackColor="Transparent" 
            BorderStyle="None" ClientIDMode="Static" ForeColor="Transparent" Height="41px" Width="101px" />&nbsp;&nbsp;
            <asp:Button ID="btncontinue" runat="server" Text="SUBMIT" 
                    Style="background-image: url(images/imagebutton.png); background-repeat: no-repeat; font-size:medium; color:White" BackColor="Transparent" 
            BorderStyle="None" ForeColor="Transparent" Height="41px" Width="101px" 
                    Visible="False" onclick="Button1_Click" />

            </ContentTemplate>  
</asp:UpdatePanel>

Open in new window

d2foxAsked:
Who is Participating?

Improve company productivity with a Business Account.Sign Up

x
 
jagssiduralaConnect With a Mentor Commented:
Change the code as below

<asp:UpdatePanel  runat="server" id="UpdatePanel2">          
            <ContentTemplate>
             
<div style=" border-style:solid; border-width:1px;">
<div style=" background-color:#f5f8fa; border-style:solid;
border-color:#f5f8fa;
border-width:30px;width:X;float:left">
              <div style="width:X;float:left"><asp:Label runat="server"  id="DateTimeLabel2" /></div>        
                <asp:Panel ID="pnlChoice" runat="server">
                </asp:Panel> <br />
</div>
</div>
<br />
<p style="display:none" id="para">jjj</p>
<asp:Button runat="server" id="UpdateButton2"   OnClientClick="SendForm()" onclick="UpdateButton_Click" text="Update"  Style="background-image: url(images/imagebutton.png); background-repeat: no-repeat; font-size:medium; color:White" BackColor="Transparent"
            BorderStyle="None" ClientIDMode="Static" ForeColor="Transparent" Height="41px" Width="101px" />
&nbsp;&nbsp;
<asp:Button ID="btncontinue" runat="server" Text="SUBMIT"
                    Style="background-image: url(images/imagebutton.png); background-repeat: no-repeat; font-size:medium; color:White" BackColor="Transparent"
            BorderStyle="None" ForeColor="Transparent" Height="41px" Width="101px"
                    Visible="False" onclick="Button1_Click" />
            </ContentTemplate>  
</asp:UpdatePanel>      


Put the width of main div width and label container div width should be same. set width as per your design
0
 
ramkihardyCommented:
If you want to position the panel below the label datetime2...
Good Idea for this is assign the position of the panel like this
pnlChoice.y = DateTimeLable2.Length+10;
This will work fine
regards
Ramki
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.