CODEWITHSUNDEEP
htmlcss
Logi
Logi

Reputation: 115

Input Box Text Color with CSS wheather on focus or not

I have a table that runs a script that puts a tablefilter at the top. The table font is white so it makes the text in my input box white as well and you cannot see what you type. I have done this in CSS:

input, select, textarea{
color: black;
}

textarea:focus, input:focus {
color: black;
}

The only issue with the above is if you lose focus on the box it changes back to white. So you type something in and move on to the next box and it turns white again. How can I make it work in CSS that once I enter text and even if I lose focus on the text box it stays black?

Upvotes: 1

Views: 3381

Answers (1)

jagmitg
jagmitg

Reputation: 4546

Here: http://jsfiddle.net/fw26qevk/1/

#myTextBox {
    border: 3px solid gray;
    width: 368px;
    height: 33px;
    color: silver;
    font-size: 22px;
    padding-left: 10px;
    padding:5px; 
    color:black

}

#myTextBox:focus{
    outline:none;
    border-color:blue;
    box-shadow:0 0 10px blue;
    color:blue;
}

You can also do it with CSS but adding a class on it when in and out of focus.

$('input[type="text"]').focus(function() {
    $(this).addClass("focus");
});

$('input[type="text"]').blur(function() {
    $(this).removeClass("focus");
});

Upvotes: 1

Related Questions