CODEWITHSUNDEEP
htmlcss
Tod Lazarov
Tod Lazarov

Reputation: 91

input.placeholder text, vertical-aling property

I am trying to style my placeholder text and I would like to have the placeholder text to be sitting on top. Its currently sitting in the middle. Padding property works, margin does not, text-align property works, vertical-align does not. Is there a reason for this?

 input[type="textarea"]::-webkit-input-placeholder {
   padding: 10px;
 }
 input[type="textarea"]:-moz-placeholder {
   /* Firefox 18- */
   padding: 10px;
 }
 input[type="textarea"]::-moz-placeholder {
   /* Firefox 19+ */
   padding: 10px;
 }
 input[type="textarea"]:-ms-input-placeholder {
   padding: 10px;
 }
<div class="description">
  <label>Description</label>
  <input type="textarea" placeholder="Description"></input>
</div>

Upvotes: 0

Views: 64

Answers (1)

Ani Menon
Ani Menon

Reputation: 28199

Text area is defined like this : <textarea rows="4" cols="50">Text here</textarea>

I think this is what you want :

<div class="description">
  <label>Description</label>
  <textarea placeholder="Describe yourself here..." rows="4" cols="50" ></textarea>
</div>

Upvotes: 1

Related Questions