如何使用CSS将textarea放入div中

我在div中有一个textarea。
这是我的代码：

#mdDiv {
    position: absolute;
    top: 0px;
    left: 0px;
    height: 650px;
    width: 300px;
    background-color: blue;
}

#mdText {
    position: absolute;
    top: 10px;
    bottom: 10px;
    left: 10px;
    right: 10px;
    font-size: 18px;
}

<div id="mdDiv" >
    <textarea id="mdText">Hello World</textarea>
</div>

它显示了这一点：

但是我希望文本区域和div之间的距离是10。
所以我设置了

top: 10px;
bottom: 10px;
left: 10px;
right: 10px;

但是正确的距离太大。
如何设置文本区域和div之间的距离？