CSS Change textbox font color

Question

I've searched and searched but can't quite get this right. I have a text box on my site and in my CSS/HTML I defined it a class much like anything else and gave it a background image no problem. I decided I needed to change the font color but no matter what I do, it just doesn't work.

My text box CSS is:

.tb1 {
    background-color : #505050;
    background-image: url(images/mb_btn2.jpg);
    color: 0090ff;
    border-style: none;
    onfocus="this.value=''
}

...this doesnt seem to quite work.

I read someone else's response to a similar question that stated using

onfocus="this.value=''

which didn't do anything, I then tried, a placeholder:

<input name="username" type="text" class="tb1" maxlength="24" placeholder="Username"/>

and this sort of worked. It put a blue "Username" in the textbox. but I then have to erase it to begin typing, AND when you type it still comes out black and not in the defined color.

This is the form HTML:

<div id="login" class="login"><center>
<form action="login.php" method="post">
Username:<br><input name="username" type="text" class="tb1" placeholder="Username"<br/>
Password:<br><input class ="tb1" type="password" name="password" placeholder="Password"/><br />
<input class="tb1" type="submit" name="login" value="Login"/>
</form></center>
</div> 

So what would work to change the color of my textbox? and/or clear it out when you click on it so "Username" or "Password" is cleared and you can enter your information without having to erase it yourself prior to input?...oh and the submit button too

• Thanks

Solution 1

Fiddle

You missed # : color: #0090ff;

Solution 2

<div id="login" class="login">
            <form action="login.php" method="post">Username:
            <br>
                <input name="username" type="text" class="tb1" placeholder="Username"/> <br/>Password:
            <br>
            <input class="tb1" type="password" name="password" placeholder="Password" />
            <br />
            <input class="tb1" type="submit" name="login" value="Login" />
        </form>

</div>

CSS

.login
{
    width:250px;
    margin:0px auto;
}
.tb1 {
    background-color : #505050;
    background-image: url(images/mb_btn2.jpg);
    color: #0090ff;
    border-style: none;
}

fiddle

in your code you have used <center> , dont use it, it has been deprecated.

Soruce

Solution 3

Your hex color declaration is missing #. Change it to color: #0090ff;