添加到元素上的随机额外填充？

Question

已解决：请查看可能解决方案的评论。

我正在创建自己的网站，我用一个标题和段落制作了一个关于我的部分，然后决定把它变成一个盒子。出于某种原因，我得到了大量的额外填充（即使我在顶部或侧面完全取出了css中的填充）。 如果我将宽度设置为200px，则会显示正在发生的事情：http://i.imgur.com/a0eGAp3.png 如果我将宽度设置为400px：http://i.imgur.com/ZnxQBCC.png

＆＃13;

＆＃13;

#about
{
	color: whitesmoke;
	background: black;
	position: relative;
	right: -500px;
	width: 400px;
}

#about h3
{
	font-family: 'Raleway', sans-serif;
	font-weight: normal;
	color: whitesmoke;
}

#about p
{
	font-family: 'Raleway', sans-serif;
	font-weight: normal;
	color: whitesmoke;
}

＆＃13;

<div id="about">
    <h3>About Me</h3>
    <p>
        Text text text text text text text text text text text text text           text text text text text text text text text text text text text text text text    text text text text text text
    </p>
</div>

＆＃13;

＆＃13;

＆＃13;