如何将文本移动到绝对文本框的顶部？ （CSS）

Question

我不知道为什么文本会在中间开始。我可以使用vertical-align来使其居中，但不能将其向上移动。我也无法改变填充。如何将文本移到顶部？我试图制作一个简单的文本框。

我的HTML：

    <label for="checkbox" id="rant" />RANT</label>
    <input type="checkbox" id="checkbox" />
    <input type="text" id="rantbox" />

我的CSS：

#rantbox {
    display:none;
    position: absolute;
    }
#checkbox:checked + #rantbox {
    display: block;
    width: 200px;
    height: 300px; 
    background: white;
    border: 2px solid black;
    font-size: 15px;
    outline: none;
    position: absolute;
    margin-top: 150px;
    text-align: top;
    vertical-align: center;
    }