Javascript 对中div锁定到位，可'；不要上下移动

好的，我有一个简单的网站，上面有一个大的100px的H1标题，居中，下面有一个h2和一段，都居中

这些都排得很好

问题是，h2和p位于一个透明黑色的div内，以便在背景下轻松读取，而且它距离h1标题有点太远。div本身被锁定在适当的位置，h2和p当然在div内部。我想将div向上移动一点，但无论我如何更改top属性，它都不会移动

*注意：h1根本不在div内，也不在header标记内。就在身体标签上

我对此做了一些研究，有些人告诉我将被锁定的div的位置更改为绝对或相对，但似乎要做的只是使div及其内部的所有内容不再居中，否则它仍然被锁定。该网站的代码有点长，因此我将包括该问题涉及的每个元素的html布局和css。如果您需要更多帮助，请告诉我：）

html:

---

首先，您应该删除浏览器的所有默认填充和边距。使用下面的方法

* {
    margin: 0;
    padding: 0;
}

然后，您可以将

页边距顶部

赋予

.main body

div，使其上下移动

.main-body {
    background-color: rgba(15, 15, 15, 0.57);
    height: 425px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px; //Here.
    width: 1100px;
}

这里我给出了

页边距顶部：20px

。您可以根据您的要求进行更改

---

你必须原谅我，我是新来的，我不知道你要我做什么。。你是说我应该在jsfiddle.net上发布这个吗？没关系，你从ketan那里得到了答案。检查它是否有效。哇，我觉得自己像个白痴，我只是用了一个顶部属性来尝试上下移动，而不是边距顶部属性。奇怪的是，这在过去是有效的，我很好奇这种情况有什么不同。谢谢你的快速回答，我真的很感激

* {
    margin: 0;
    padding: 0;
}

.main-body {
    background-color: rgba(15, 15, 15, 0.57);
    height: 425px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 20px; //Here.
    width: 1100px;
}