My textarea box won't vertically align

My textarea box won't vertically align
0
#1

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?

#2

Can you provide a link?

#3

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

line 37 of my CSS- thanks :slight_smile:

#4

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.

#5

Looks like you whatever it was, you fixed it.

#6

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

#7

::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);
}