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)
-
<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)
-
<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:
-
<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):
-
<style>
-
.myPanelGroupStyle
-
{ width:50%;
-
margin:0px auto;
-
}
-
</style>
-
<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
16
