CODEWITHSUNDEEP
asp.netwebforms
fico
fico

Reputation: 9

Asp.net input type ="text" vs asp:textbox

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="Images\human.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;
}

Upvotes: 0

Views: 10373

Answers (3)

SehaxX
SehaxX

Reputation: 765

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 {
}

Upvotes: 1

adinas
adinas

Reputation: 4550

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

Upvotes: 1

fico
fico

Reputation: 9

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>

Upvotes: 0

Related Questions