Question : Login control design and Programming

I tried to find the answer to my question in the current posts. I didn't find any that lended themselves to this situation. However, I am sure this question has been asked before, so excuse the repeat.

The Preface: I am designing my website in photoshop. I am getting ready to mock up the Log in Control- adding gradients to he background, etc. The site is going to be a .net Web App. I am familiar with VS 2010 and the standard Log in Control and how to link this with the default database for membership and roles. I have tried to manipulate the Log in Control by adding a custom background

The question- Should I continue to fool around with customizing the .net log in control, or should I create my own and code it up? If i do create my own, how do I go about connecting it to the default membership and roles DB? I am assuming I must define the input areas on the control and give them an ID.. then send the input data to the Microsoft authentication service (the same one used by the default log in control)

Guys, I hope I am explaining myself well enough..In short, I just want a better looking log in area that matches my site- this is a very open ended question, so any and all help is awesome.

I code in VB and can decipher C# so either of these are acceptable if needed for an example.

Answer : Login control design and Programming

You can set the layout property of the login control and make it look any way you like.

http://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.login.layouttemplate.aspx

                       
         
           
             1:
2:
3:
4:
5:
6:
7:
8:
9:
10:
11:
12:
13:
14:
15:
16:
17:
18:
19:
20:
21:
22:
23:
24:
25:
26:
27:
28:
29:
30:
31:
32:
33:
34:
35:

           
           
             <asp:Login ID="LoginUser" runat="server" EnableViewState="false" RenderOuterTable="false">
        <LayoutTemplate>
            <span class="failureNotification">
                <asp:Literal ID="FailureText" runat="server"></asp:Literal>
            </span>
            <asp:ValidationSummary ID="LoginUserValidationSummary" runat="server" CssClass="failureNotification" 
                 ValidationGroup="LoginUserValidationGroup"/>
            <div class="accountInfo">
                <fieldset class="login">
                    <legend>Account Information</legend>
                    <p>
                        <asp:Label ID="UserNameLabel" runat="server" AssociatedControlID="UserName">Username:</asp:Label>
                        <asp:TextBox ID="UserName" runat="server" CssClass="textEntry"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName" 
                             CssClass="failureNotification" ErrorMessage="User Name is required." ToolTip="User Name is required." 
                             ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>
                    </p>
                    <p>
                        <asp:Label ID="PasswordLabel" runat="server" AssociatedControlID="Password">Password:</asp:Label>
                        <asp:TextBox ID="Password" runat="server" CssClass="passwordEntry" TextMode="Password"></asp:TextBox>
                        <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password" 
                             CssClass="failureNotification" ErrorMessage="Password is required." ToolTip="Password is required." 
                             ValidationGroup="LoginUserValidationGroup">*</asp:RequiredFieldValidator>
                    </p>
                    <p>
                        <asp:CheckBox ID="RememberMe" runat="server"/>
                        <asp:Label ID="RememberMeLabel" runat="server" AssociatedControlID="RememberMe" CssClass="inline">Keep me logged in</asp:Label>
                    </p>
                </fieldset>
                <p class="submitButton">
                    <asp:Button ID="LoginButton" runat="server" CommandName="Login" Text="Log In" ValidationGroup="LoginUserValidationGroup"/>
                </p>
            </div>
        </LayoutTemplate>
    </asp:Login>

           
         