textareaで投稿フォームを作ったときにキャレットの位置がずれる

投稿画面を作った際に写真のようにキャレット？（本当の名前かどうかはよくわかりませんが）のいちが少し上にずれてしまうのですがこれはCSSで修正できるのでしょうか。
調べてみたところiPhoneでの修正方法は載っていたのですがPCのブラウザでの修正方法が載っていませんでした。
(各ブラウザで試してみたのですがすべてのブラウザで同じ現象が起こりました）

詳しい方教えていただけると幸いです。

HTML
1<div class="timeline-post-new">
2    <form enctype="multipart/form-data" action="/posts" accept-charset="UTF-8" data-remote="true" method="post"><input name="utf8" type="hidden" value="✓"><input type="hidden" name="authenticity_token" value="b8isHN+ByFBVxfOdZZEJijxzWS60GpmlrqCg98mfuux7b33n1DwyO8ZPgPfXyDpynkmNc2oWWXFzj2VTeBpuIQ==">
3        <textarea placeholder="投稿内容" class="timeline-post-form-new" rows="3" onkeyup="ShowLength(value);" id="text" name="post[text]" style="overflow: hidden;vertical-align: middle;"></textarea>
4          
5      <div class="timeline-new-buttons">
6      <div id="preview" class="preview"></div>
7        <label class="post-label">
8        <div class="tooltip1">
9        <span class="filelabel">
10        <input id="filesend" onchange="imgPreView(event)" accept="image/*" class="photo-up" type="file" name="post[image]">
11        <span class="material-icons post-photo">image</span>
12        <div class="photo-pop">画像を追加</div>
13        </span>
14        </div>
15        </label>
16        <label class="post-label">
17        <div class="tooltip1">
18        <span class="filelabel">
19        <input id="filesend" onchange="imgPreView(event)" accept="video/*" class="video-up" type="file" name="post[video]">
20        <span class="material-icons post-photo">videocam</span>
21        <div class="video-pop">動画を追加</div>
22        </span>
23        </div>
24        </label>
25      　
26        <input type="submit" name="commit" value="投稿" class="new-post-btn" id="submit" data-disable-with="投稿">
27        <p id="inputlength" class="new-textlength">0/250</p>
28      </div>
29      <div class="accbox">
30       <label for="label1"><span class="material-icons">arrow_drop_down</span></label>
31       <input type="checkbox" id="label1" class="cssacc">
32       <div class="accshow">
33       <div class="md-checkbox">
34       <input name="post[noreply]" type="hidden" value="0"><input autofocus="autofocus" id="noreply" type="checkbox" value="1" name="post[noreply]">
35       <label for="noreply" class="check-text">この投稿へのリプライを無効にする</label>
36      </div>
37       </div>
38      </div>
39</form></div>
40

CSS
1.timeline-post-new {
2    padding: 10px;
3    border-bottom: 1px solid var(--border-color);
4    background: var(--card-color);
5}
6.timeline-post-form-new {
7    cursor: text;
8    background-color: var(--card-color);
9    border-radius: 4px 4px 0px 0px;
10    width: 100%;
11    height: 130px;
12    padding: 10px;
13    margin: 0px 0px 10px 0px;
14    resize: none;
15    border: none;
16    color: var(--primary-color);
17    font-size: 19px;
18    box-sizing: border-box;
19}
20.timeline-new-buttons {
21    width: 100%;
22    background-color: var(--card-color);
23    margin: -16px 0px 0px 0px;
24    border-radius: 0px 0px 4px 4px;
25}