My textarea box won't vertically align

I’m almost done with my survey but the final textarea box refuses to vertically align. My placeholder text is sitting mid-way down the box instead of at the top left hand corner where I want it.

I’ve tried padding, vertical align and line height. Nothing moves at all.

I’m using

‘’’
#small-box::-webkit-input-placeholder {
}
‘’’
thing is, I can change the placeholder color and the horizontal alignment but vertically, it just sits staring at me, motionless.

Any ideas?

Can you provide a link?

https://codepen.io/JammyPiece/pen/vwKPgL

line 37 of my CSS- thanks :slight_smile:

Made my own workaround. I put it the height to 10px which means that the line of text is parallel with the top of the box then added padding-bottom: 90px to get a 100px height box with the text along the top line. Couldn’t find anything that worked online at all.

Looks like you whatever it was, you fixed it.

Yup. But still don’t know why the normal stuff didn’t work :frowning:

::placeholder

Only the subset of CSS properties that apply to the ::first-line pseudo-element can be used in a rule using ::placeholder in its selector.

You can use transform to move the placeholder text.

#small-box::placeholder {
  transform: translateY(-20px);
}