Qfyilyi

I'm new Asp.Net.I have input type="text" also I have css class for input[type="text"]. So I have an asp:textbox. How can I write css class for my asp:textbox which is a different css class then the one for input?

My asp:textbox takes properties from
.login-box input[type=text], input[type=password]

<div class="login-box" style="padding:70px 30px">

    <img src="Imageshuman.png" class="man"/>

    <h1>Login Here</h1>

    <p>Username</p>   

    <input id="username" type="text" name="username" placeholder="Enter Username" runat="server"/>

    <p>Password</p>

    <input type="password" name="password" placeholder="Enter Password"/>

    <asp:Button ID="btnLogin" runat="server" Text="Login" OnClick="btnLogin_Click"/>

    <asp:TextBox ID="txtError" CssClass="text-hide" runat="server">Incorrect username or password!</asp:TextBox>

    <a href="#">Forgot Password</a>

</div>

My style.css below:

.login-box input {

    width: 100%;

    margin-bottom: 20px;

}

.text-hide {

    height:40px;

    border-color:Transparent;

    background-color:Transparent;

    color:Red;

}

.login-box input[type=text], input[type=password] {

    height: 40px;

    border: 0;

    border-bottom: 1px solid #fff;

    background-color: transparent;

    color: #fff;

    font-size: 16px;

    outline: none;

}

Use CssClass property. Like so:

<asp:TextBox ID="txtError" CssClass="text-hide" runat="server">

This will turn into :

<input type="text" class="text-hide">

on the page

You want to use a label, literal or panel all can be used with asp: prefix to show some message in ASP.Net Web Form.

You don't add messages in input fields like in your example

<asp:Label ID="txtError" CssClass="text-hide" runat="server" Text="Incorrect username or password!"></asp:Label>

After this you can reference this class in your CSS like this:

.text-hide {

}

Username

    <input id="username" type="text" name="username" placeholder="Enter Username" runat="server"/>

    <p>Password</p>

    <input type="password" name="password" placeholder="Enter Password"/>

    <asp:Button ID="btnLogin" runat="server" Text="Login" OnClick="btnLogin_Click"/>

    <asp:TextBox ID="txtError" class="text-hide" runat="server">Incorrect username or password!</asp:TextBox>