CODEWITHSUNDEEP
htmlcssvue.js
user12364517
user12364517

Reputation:

How to change the color of Placeholder in Div?

I am a bit stuck to change the color of the Placeholder in div. I am using VueJs to bind placeholder with my div element. Here is the front-end :

enter image description here

VueJs Code :

<div class="new-message-input form-control" id="plc" contenteditable :data-placeholder="$t('chat.type_a_message')" :placeholder="$t('chat.type_a_message')" ref="newMessageInput" @keydown="isTyping" @keydown.enter="enterPressedEvt(postMessage, $event)">

Css Code :

#plc::placeholder { 
  color: white;
}

Upvotes: 0

Views: 616

Answers (1)

Bijoy
Bijoy

Reputation: 66

#plc{
  padding: 10px;
  background-color: orange;
}

[contentEditable=true]:empty:not(:focus):before{
    content:attr(data-text);
    color: white;
}
<div id="plc" contentEditable=true data-text="Type a message..."></div>

Upvotes: 2

Related Questions