Problem in ASP.NET with Visual Web Developer

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • greenMark
    New Member
    • Nov 2007
    • 16
    #1

    Problem in ASP.NET with Visual Web Developer

    I recently moved to Visual web developer 2008 and it seems I can't move the GUI controls(Text box,lables etc) where I want them. when i drag the control,example the button,to my page,it display on the upper left corner of my page..i try to move it in the middle of the page..but i cant..how can i solve this problem.
    Is there a way to sort out this issue.

    Thanks
    Tags: None
    • Frinavale
      Recognized Expert Expert
      • Oct 2006
      • 9749
      #2
      You need to use CSS or the style tag of the element.

      There are two ways to do this. You can set the "style" property or you can set the "CssClass" property.

      Either way you need to use css to do this.

      If you want your controls to appear in the middle of the page, place them in a Panel (which renders in the browser as a <div> tag) and set the style for the panel.

      For example, after dragging the panel onto the page you should get the following ASP generated (view the Source instead of Design)

      Code:
      <asp:Panel id="Panel1" runat="server">

</asp:Panel>

      You can place your controls inside the Panel (either by dragging them into the panel in Desgin view or placing them there in your code)

      Code:
      <asp:Panel id="Panel1" runat="server">
    <asp:Label id="prompt" runat="server" Text="Prompt for the text box"></asp:Label>
    <asp:TextBox id="input" runat="server"></asp:TextBox>
</asp:Panel>
      By default your Label will appear on the left of the TextBox in the above example.

      To get this group to appear at the top of the page in the middle of the browser you will set the following style for the Panel:
      Code:
      <asp:Panel id="Panel1" runat="server" style="width:50%; margin:0px auto;">
    <asp:Label id="prompt" runat="server" Text="Prompt for the text box"></asp:Label>
    <asp:TextBox id="input" runat="server"></asp:TextBox>
</asp:Panel>
      You could define a style for this and use the CssClass property of the Panel instead.

      For example (place this in the <head> section of your ASP code):
      Code:
      <style>
  .myPanelGroupStyle
  {  width:50%;
     margin:0px auto;
  }
</style>
      Code:
      <asp:Panel id="Panel1" runat="server" CssClass="myPanelGroupStyle">
    <asp:Label id="prompt" runat="server" Text="Prompt for the text box"></asp:Label>
    <asp:TextBox id="input" runat="server"></asp:TextBox>
</asp:Panel>
      So, I recommend you familiarize yourself with CSS to learn how to do this according to your design requirements.

      -Frinny

        Comment

        • greenMark
          New Member
          • Nov 2007
          • 16
          #3
          Thanks a lot.... this is really helpful... thanks again

            Comment

            Previous template Next
            Working...