Question

How do I style the asp.net membership control with css? I’d like to put different classes on the username textbox, the password textbox, and the login button.

Answer 1

You have two options.

First – give the Login control some class and use css selectors to access styles of its inner controls:

aspx:

<asp:Login ID="Login2" runat="server" EnableViewState="true" CssClass="login">

css:

.login input[type="text"] {...} /*username*/
.login input[type="password"] {...} /*password*/
.login input[type="submit"] {...} /*submit button*/

Second – define you own template for the Login control and use whatever classes you need.

aspx:

<asp:Login ID="LoginUser" runat="server" EnableViewState="false" RenderOuterTable="false">
    <LayoutTemplate>
    ...
    <asp:TextBox ID="UserName" runat="server" CssClass="username" />
    ...
    <asp:TextBox ID="Password" runat="server" CssClass="password" TextMode="Password" />
    ...
    <asp:Button ID="LoginButton" runat="server" CommandName="Login" Text="Log In" ValidationGroup="LoginUserValidationGroup" CssClass="submitButton"/>
    ...
    </LayoutTemplate>
</asp:Login>