How to deal with the top distance caused by line-height in CSS?


as mentioned, I created a textarea, to achieve an effect similar to that in figure 1, with the text at a distance of 6 from the top horizontal line.
but line-height caused the distance between the text of textarea and the top, so I had to set padding-top to 2.
but when there are too many words, the drop-down looks like figure 2 again, which is very ugly.

is there any way to make the distance between the text and the top 0 after line-height setting?
so I can use padding to handle margins. Thank you very much!

Sep.24,2021

I tried, and it won't happen as you said. padding will scroll along with the content, so there will be no white bar occlusion at the top.

I guess whether you have tag nesting and whether padding is set on the outer element.

   

Menu