CODEWITHSUNDEEP
htmlcssgoogle-chrome
James Barrett
James Barrett

Reputation: 2806

textarea focus not working on chrome?

I am trying to implement a textarea with on click focus which removes the placeholder text. It is working in Firefox and IE but not Chrome. Not sure if I am doing something silly here...

HTML:

<textarea id="bio" name="user_bio" placeholder="Hi, I am a member of Footdrive!"></textarea>

CSS: 

/*Input fields focus and text transparency*/

input:focus::-webkit-input-placeholder {
    color: transparent;
}

input:focus:-moz-placeholder {
     color: transparent;
}

 input:focus::-moz-placeholder {
     color: transparent;
}

 input:focus:-ms-input-placeholder {
    color: transparent;
}


/*Biography field focus and text transparency*/

textarea:focus::-webkit-textarea-placeholder {
    color: transparent;
}

textarea:focus:-moz-placeholder {
    color: transparent;
}

 textarea:focus::-moz-placeholder {
    color: transparent;
}

textarea:focus:-ms-textarea-placeholder {
    color: transparent;
}

Upvotes: 2

Views: 2443

Answers (2)

maťo
maťo

Reputation: 1302

Correct solution is the same than input:

textarea:focus::-webkit-input-placeholder{
  color: transparent;
}

Upvotes: 1

javirescalvo
javirescalvo

Reputation: 13

You may try:

textarea:focus::-webkit-textarea-placeholder {
    content: "";
}

Upvotes: 0

Related Questions