1：标题和div上方的空白，Normalize和margin：0未解决。 2：调整列

Question

我在找出2个问题时遇到了麻烦，希望能得到一些帮助。

问题2我仍在调查中，但是我把它扔在这里，以防有人快速解决问题。

这是我的jsfidle：https://jsfiddle.net/zf0ecsnp/5/

问题1

我似乎无法弄清楚是什么在div和header上方创建了一小行/空白区域。

在jsfiddle中运行它时不存在，但是当我在浏览器中打开index.html文件时它就存在。

查看图片：https://imgur.com/a/tZueV3T

我尝试将其添加到我的CSS中，但这一切都搞砸了：

* {
        margin: 0;
        padding: 0;
    }

Normalize.css也没有处理它。

对于h2和div我也都尝试过

h2 {
        margin: 0;
    }

但是它没有解决。

问题2

我希望标题（标题1，标题2，标题3超过2行）和列周围的框与最长的标题和/或框一样长。

我尝试在上边距和下边距100％和-100％之间进行操作，并溢出：隐藏，但是这消除了下边距。

谢谢！

Answer 1

对于第一个问题，我无法重现该问题。我没有空格

对于第二个问题，您可以使用称为Grid的东西。

 grid-template-rows:    minmax(100px, auto); 
 grid-template-columns: minmax(auto, 50%) 1fr 3em;

链接更多信息https://learncssgrid.com/#grid-container

Answer 2

尝试：     正文{margin：0;}

这是由于默认浏览器余量